中午有限时间写这博文,前言就不必多说了,直奔主题吧。

BUI是一个前端框架,关于BUI的介绍请看博主的文章那些年用过的一些前端框架

下面我们开始实例的讲解!

一、效果演示:

上传成功后,会发现本地相应的sava目录下多了刚刚上传的图片(因为只是一个例子,就保存在本地目录了)。

二、实例讲解

本实例使用的环境,eclipse + maven。

使用的技术:SpringMVC + BUI。

关于Spring和SpringMVC的配置,这里就不多说明了。最后会提供源码下载,猿友们自行下载即可看到所有配置文件和代码。

SpringMVC想要实现上传文件,还需要添加如下jar依赖:

<!-- 文件上传相关包 -->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.1</version>
</dependency>
<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.4</version>
</dependency>
<dependency>
<groupId>tomcat</groupId>
<artifactId>catalina-manager</artifactId>
<version>5.5.23</version>
</dependency>

另外还需要在spring-mvc.xml文件里面添加bean:

<!-- 支持上传文件 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"/>

下面是直接上controller代码:

package com.luo.controller;

import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;
import org.springframework.web.servlet.ModelAndView; @Controller
public class UserController { private final String SAVE_DIR = "C:/Users/luoguohui/Desktop/save/"; @RequestMapping("/index.jhtml")
public ModelAndView getIndex(HttpServletRequest request) throws IOException {
ModelAndView mav = new ModelAndView("index");
return mav;
} @RequestMapping(value="/uploadFlie.json", method=RequestMethod.POST)
@ResponseBody
public String uploadFlie(HttpServletRequest request)
throws IOException {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
Map<String, MultipartFile> fileMap = multipartRequest.getFileMap();
String fileName = null;
for (Map.Entry<String, MultipartFile> entity : fileMap.entrySet()) {
MultipartFile myfile = entity.getValue();
fileName = myfile.getOriginalFilename();
byte[] bs = myfile.getBytes();
File file = new File(SAVE_DIR + fileName);
FileOutputStream fos = new FileOutputStream(file);
fos.write(bs);
fos.close();
}
return "{\"url\" : \"" + SAVE_DIR + fileName + "\"}";
}
}

上面的代码就不作过多的解释的了,基本一看就懂,就是把获取到的上传的文件放到如下目录:

C:/Users/luoguohui/Desktop/save/

下面上前端代码:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
<head>
<link href="<%=request.getContextPath()%>/static/bui/css/dpl-min.css" rel="stylesheet">
<link href="<%=request.getContextPath()%>/static/bui/css/bui-min.css" rel="stylesheet">
<script src="<%=request.getContextPath()%>/static/bui/js/jquery-1.8.1.min.js"></script>
<script src="<%=request.getContextPath()%>/static/bui/js/bui-min.js"></script>
<script src="<%=request.getContextPath()%>/static/bui/js/layout-min.js"></script>
<script src="<%=request.getContextPath()%>/static/bui/js/uploader-min.js"></script>
</head>
<body>
<div class="demo-content" style="margin:20px;">
<div class="row">
<div class="span8">
<div id="J_Uploader">
</div>
</div>
</div>
</body>
<script type="text/javascript">
// http://120.26.80.109/demo/uploader.php#uploader/checkSuccess.php
BUI.use('bui/uploader',function (Uploader) {
/**
* 返回数据的格式
* 默认是 {url : 'url'},否则认为上传失败
* 可以通过isSuccess 更改判定成功失败的结构
*/
var uploader = new Uploader.Uploader({
render: '#J_Uploader',
url: '<%=request.getContextPath()%>' + '/uploadFlie.json',
rules: {
//文的类型
ext: ['.png,.jpg','文件类型只能为{0}'],
//上传的最大个数
max: [1, '文件的最大个数不能超过{0}个'],
//文件大小的最小值,这个单位是kb
minSize: [10, '文件的大小不能小于{0}KB'],
//文件大小的最大值,单位也是kb
maxSize: [2048, '文件大小不能大于2M']
},
//根据业务需求来判断上传是否成功
isSuccess: function(result){
if(result && result.url){
BUI.Message.Alert("上传成功,文件已保存到目录:" + result.url);
}else{
BUI.Message.Alert("上传失败");
}
}
}).render();
});
</script>
</html>

上面的代码主要是使用了BUI的上传文件功能,记得需要导入uploader-min.js才能上传哦,另外对上传的文件数量,格式,大小作了一些设置。

三、源码下载

http://download.csdn.net/detail/u013142781/9421985

下载源码,项目跑起来之后访问如下url即可跳转到文件上传页面:

http://localhost:8080/first_maven_project/index.jhtml

时间有限,就介绍到这里了,如有什么不明白的地方,欢迎私信或评论交流。

SpringMVC+BUI实现文件上传(附详解,源码下载)的更多相关文章

  1. Struts2+Uploadify文件上传使用详解

    Uploadify是JQuery的一个上传插件,实现的效果非常不错,带进度显示.不过官方提供的实例是php版本的,本文将详细介绍Uploadify在java中的使用,您也可以点击下面的链接进行演示或下 ...

  2. Web应用安全之文件上传漏洞详解

    什么是文件上传漏洞 文件上传漏洞是在用户上传了一个可执行的脚本文件,本通过此脚本文件获得了执行服务器端命令的功能,这种攻击方式是最为直接,最为有效的,有时候,几乎没有什么门槛,也就是任何人都可以进行这 ...

  3. php文件上传原理详解(含源码)

    1.文件上传原理 将客户端的文件上传到服务器,再将服务器的临时文件上传到指定目录 2.客户端配置 提交表单 表单的发送方式为post 添加enctype="multipart/form-da ...

  4. jquery组件WebUploader文件上传用法详解

    这篇文章主要为大家详细介绍了jquery组件WebUploader文件上传用法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 WebUploader是由Baidu WebFE(FEX)团队开发的一 ...

  5. FastDFS的配置、部署与API使用解读(8)FastDFS多种文件上传接口详解(转)

    1.StorageClient与StorageClient1的区别 相信使用happy_fish的FastDFS的童鞋们,一定都熟悉StorageClient了,或者你熟悉的是StorageClien ...

  6. ASP.Net大文件上传组件详解

    首先右键单击网站根目录,在弹出的快捷菜单中,选择"添加引用"菜单项,弹出"添加引用",切换到"浏览"找到组件的Dll文件"Best ...

  7. [上传下载] C# ImageUpload图片上传类教程与源码下载 (转载)

    点击下载 ImageUpload.zip 功能如下图片1.设置属性后上传图片,用法如下 /// <summary> /// 图片上传类 /// </summary> //--- ...

  8. Python-Flask框架之——图书管理系统 , 附详解源码和效果图 !

    该图书管理系统要实现的功能: 1. 可以通过添加窗口添加书籍或作者, 如果要添加的作者和书籍已存在于书架上, 则给出相应的提示. 2. 如果要添加的作者存在, 而要添加的书籍书架上没有, 则将该书籍添 ...

  9. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(32)-swfupload多文件上传[附源码]

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(32)-swfupload多文件上传[附源码] 文件上传这东西说到底有时候很痛,原来的asp.net服务器 ...

随机推荐

  1. 机器学习基石:01 The Learning Problem

    什么时候适合用机器学习算法? 1.存在某种规则/模式,能够使性能提升,比如准确率: 2.这种规则难以程序化定义,人难以给出准确定义: 3.存在能够反映这种规则的资料. 所以,机器学习就是设计算法A,从 ...

  2. [HNOI 2015]亚瑟王

    Description 小 K 不慎被 LL 邪教洗脑了,洗脑程度深到他甚至想要从亚瑟王邪教中脱坑. 他决定,在脱坑之前,最后再来打一盘亚瑟王.既然是最后一战,就一定要打得漂 亮.众所周知,亚瑟王是一 ...

  3. [测试题]幸运序列(lucky)

    Description Ly喜欢幸运数字,众所周知,幸运数字就是数字位上只有4和7的数字. 但是本题的幸运序列和幸运数字完全没关系,就是一个非常非常普通的序列.哈哈,是不是感觉被耍了,没错,你就是被耍 ...

  4. [PA 2014]Kuglarz

    Description 魔术师的桌子上有n个杯子排成一行,编号为1,2,…,n,其中某些杯子底下藏有一个小球,如果你准确地猜出是哪些杯子,你就可以获得奖品.花费c_ij元,魔术师就会告诉你杯子i,i+ ...

  5. [IOI2007]训练路径

    Description 马克(Mirko)和斯拉夫克(Slavko)正在为克罗地亚举办的每年一次的双人骑车马拉松赛而紧张训练.他们需要选择一条训练路径. 他们国家有N个城市和M条道路.每条道路连接两个 ...

  6. 模板 AC自动机

    题目描述 有$N$ 个由小写字母组成的模式串以及一个文本串$T$ .每个模式串可能会在文本串中出现多次.你需要找出哪些模式串在文本串$T$ 中出现的次数最多. 输入输出格式 输入格式: 输入含多组数据 ...

  7. 洛谷P1593 因子和

    题目描述 输入两个正整数a和b,求a^b的因子和.结果太大,只要输出它对9901的余数. 输入输出格式 输入格式: 仅一行,为两个正整数a和b(0≤a,b≤50000000). 输出格式: a^b的因 ...

  8. [POJ]1279: Art Gallery

    题目大意:有一个N边形展馆,问展馆内有多少地方可以看到所有墙壁.(N<=1500) 思路:模板题,半平面交求出多边形的核后计算核的面积. #include<cstdio> #incl ...

  9. [BZOJ]2017省队十连测推广赛1

    听学长说有比赛就随便打一打. A.普通计算姬 题目大意:给出一棵带权树,支持一下两种操作:1.修改一个点的权值:2.给出l,r,询问以点l为根的子树和.点l+1为根的子树和.点l+2为根的子树和--点 ...

  10. Linux下date使用

    [root@host1 ~]# date #显示时间 2017年 06月 01日 星期四 17:02:59 CST 以指定格式显示时间: [root@host1 ~]# date +%Y%m%d 20 ...