框架是个强大的东西,一般你能想到的,框架都会帮你做了,然后只需要会用就行了,spingmvc中有处理异步请求的机制,而且跟一般处理请求的方法差别不大,只是多了一个注解;spingmvc也可以将string、list、map转化成json数据;然后前台发起一个ajax请求,后台处理完成返回json数据,这就是异步上传文件的基本思路。

1、springMVC处理异步请求配置

  首先是需要的jar包资源

  上传文件的jar:

  commons-fileupload-1.2.2.jar

  commons-io-2.4.jar

  json格式转换的jar:

  jackson-databind-2.5.4.jar

  jackson-core-2.5.4.jar

  jackson-annotations-2.5.0.jar

  导入Jackson的包之后,在控制器处理请求的方法中,就可以直接返回string、list、map,甚至可以是Map<String , List<String>>这样格式的数据,框架都会转换成json格式的数据返回给前台,因为springMVC内置就是使用Jackson来转换格式的,所以只需要导入jar包,框架就会帮我们自动转换成json格式的数据。例如,在控制器的方法中返回了这样的一个map  Map<String, List<String>> hashMap = new HashMap<String , List<String>>(); 返回到前台的格式就是:{"vals":["12136","896","128","10915"],"keys":["台区总数","一般警告","严重警告","正常台区"]}

  导入jar包资源之后还需要在springMVC的全局配置文件中配置文件上传的bean,如果用到了json数据格式转换也需要在全局配置文件中配置。

  上传文件需要的配置:

<!-- 文件上传   设置文件大小限制 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize">
<value>5242880</value>
</property>
<!-- 设置默认的编码方式 -->
<property name="defaultEncoding">
<value>UTF-8</value>
</property>
</bean>

  

  json格式转换的配置:

<!-- 处理ajax请求,将返回的数据转为json -->
<bean id="contentNegotiationManager" class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean">
<property name="favorPathExtension" value="false" />
</bean>
<bean id="jsonConverter" class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"></bean> <bean id="stringConverter"
class="org.springframework.http.converter.StringHttpMessageConverter">
<property name="supportedMediaTypes">
<list>
<value>text/plain;charset=UTF-8</value>
</list>
</property>
</bean> <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
<property name="messageConverters">
<list>
<ref bean="stringConverter" />
<ref bean="jsonConverter" />
</list>
</property>
</bean>

2、前台的ajax请求

  前台使用ajax发起异步请求,思路:异步请求肯定是js来提交请求,但是这里的输入的内容是一个文件,可以使用H5中的Formdata对象,然后通过js获取到input中的值放到Formdata中,然后把Formdata传到后台。

  具体代码如下:

$("#importDetialDataExcel").click(function(){
var detailDataExcel = document.detailDataForm.detailDataExcel.files[0];
var myForm = new FormData();
myForm.append("detailDataExcel",detailDataExcel);
$("#detailDataState").text("上传中...");
ajaxImport(myForm,"uploadDetailData.shtml","#detailDataState");
}); // 用于发起异步请求
function ajaxImport(myForm,myurl,state) {
$.ajax({
url : myurl,
type : "post",
data : myForm,
dataType : 'json',
contentType : false, // 禁止设置请求类型
processData : false, // 禁止jquery对DAta数据的处理,默认会处理
// 禁止的原因是,FormData已经帮我们做了处理
success : function(result) {
// alert(result.result);
showMsg('文件' + result.result + '上传成功', 'bottom');
$(state).text("已上传");
},
error : function(data) {
showMsg('文件上传失败', 'bottom');
$(state).text("上传失败");
}
});
}

  

3、spingmvc控制器中的方法

  数据到了后台处理方式和平时差别不大,只需要在方法前加一个@ResponseBody注解,这样返回的数据格式就是json格式,值得注意的是在方法的参数中,对象的类型就是MultipartFile,名称必须和ajax请求参数中的名称一致,detailDataExcel,也就是放入到Formdata中的参数名。接收到文件后写入到本地磁盘或者作其他处理。

  具体代码如下:

@RequestMapping("uploadDetailData.shtml")
@ResponseBody
public Map<String, String> importDetailDataExcel(MultipartFile detailDataExcel)
throws RuntimeException, IOException {
Map<String, String> mapResult = new HashMap<String, String>(); // 新建map向客户端返回数据
if (!detailDataExcel.isEmpty()) {
// 设置文件上传保存的路径
String path = "D:\\java\\workSpace\\ElectricSystem\\upload\\detailData\\";
String originFileName = detailDataExcel.getOriginalFilename(); // 获取文件的原始文件名
File file = new File(path + originFileName);
detailDataExcel.transferTo(file); // 将文件写入磁盘
mapResult.put("result", originFileName);
}
return mapResult;
}

  

spingMVC异步上传文件的更多相关文章

  1. Servlet异步上传文件

    这里需要用到插件ajaxfileupload.js,jar包:commons-fileupload-1.3.2.jar,commons-io-2.5.jar 注意红色部分的字!!!! 1.创建一个we ...

  2. struts2 jquery ajaxFileUpload 异步上传文件

    网上搜集的,整理一下. 一.ajaxFileUpload 实现异步上传文件利用到了ajaxFileUpload.js这个文件,这是别人开发的一个jquery的插件,可以实现文件的上传并能够和strut ...

  3. 关于js异步上传文件

    好久没登录博客园了,今天来一发分享. 最近项目里有个需求,上传文件(好吧,这种需求很常见,这也不是第一次遇到了).当时第一想法就是直接用form表单提交(原谅我以前就是这么干的),不过表单里不仅有文件 ...

  4. 利用ajaxfileupload.js异步上传文件

    1.引入ajaxfileupload.js 2.html代码 <input type="file" id="enclosure" name="e ...

  5. 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)

    前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...

  6. 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload

    http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...

  7. 利用jquery.form实现异步上传文件

    实现原理 目前需要在一个页面实现多个地方调用上传控件上传文件,并且必须是异步上传.思考半天,想到通过创建动态表单包裹上传文件域,利用jquery.form实现异步提交表单,从而达到异步上传的目的,在上 ...

  8. HTML5预览图片、异步上传文件

    注意啦:本文的代码都是以JQuery为示例,jq_开头的变量都是jq对象. 在HTML5中,我们可以在图片上传之前对图片进行预览,就像下面这么做 jq_upload_file.change(funct ...

  9. (H5)FormData+AJAX+SpringMVC跨域异步上传文件

    最近都没时间整理资料了,一入职就要弄懂业务,整天被业务弄得血崩. 总结下今天弄了一个早上的跨域异步上传文件.主要用到技术有HTML5的FormData,AJAX,Spring MVC. 首先看下上传页 ...

随机推荐

  1. 解决easyui combobox赋值boolean类型的值时,经常出现的内容显示的value而不是text的bug

    版本:EasyUI 1.7.0 在用easyui写项目时,碰到一个combobox的奇葩bug.代码如下: <div> <select class="easyui-comb ...

  2. Java用户自定义函数

    用户除了可以使用JavaScript的内置函数之外,还可以自己定义函数.自定义函数有3种方法. 使用关键字 function 构造 语法: function funcName([param1][,pa ...

  3. Android tabLayout+recyclerView实现锚点定位

    原文链接:https://mp.weixin.qq.com/s/L3o2i3WTmg1ScXEYDS8YCg 在上一篇文章 Android 实现锚点定位中,我们介绍了tablayout+scrollV ...

  4. c++趣味之返回void

    void a(){} void b(){return a();} int main() { b(); ; } 这个是能编译的(vs,gcc),void函数是能返回,一般不会这么写,但是这样确实可以.你 ...

  5. 编程经验点滴----巧妙解决 Oracle NClob 读写问题

    最近一个新项目中,尝试在 Oracle 数据库中使用 NCLOB 来保存大的 xml 字符串. 在代码自动生成工具(通过 JDBC 驱动程序,读数据库表结构,自动生成对应的 java 代码,包含增加. ...

  6. Spark性能优化【Stack Overflow】

    一.异常情况 Stack Overflow 二.异常分析 之所以会产生Stack Overflow,原因是在Stack方法栈中方法的调用链条太长的原因导致的,一般情况有两种: 1.过于深度的递归[常见 ...

  7. JMeter—总结

    Jmter简单总结 简单的使用篇 jmeter简单的使用 Jmeter中默认语言的显示 jmeter利用自身代理录制脚本 Jmeter运行后出现乱码 http cookie管理中cookie poli ...

  8. C#-循环语句(六)

    for循环 格式: for(表达式1;循环条件;表达式2) { 循环体; } 解释:先执行表达式1,再判断循环条件是否为真,如果为真则执行循环体,执行完成后再执行表达式2 再次判断循环条件,由此一直反 ...

  9. C#-基本语法(三)

    关键词 关键字,是一些被C#规定了用途的重要单词 在Visual Studio的开发环境中,关键字被标识为蓝色 例如: using:导入命名空间 class:声明类 static:静态 void:无返 ...

  10. sql语句中的join用法(可视化解释)

    一.innerjoin innerjoin总结来说就是 ,如A知道通往B如何走:B知道通往C如何走:但是A不知道通往C如何走,但是A可以通过B获得去往C的通往方式.. 首先,假设有A,B两张表,结构及 ...