SpringMVC + jquery.uploadify实现上传文件功能
前言
以前用Asp.net MVC+uploadify上传文件，最近学习SpringMVC，所以就用SpringMVC+uploadify做个上传文件的demo。
刚开始用form表单的方式提交，在Controller Action中用@RequestParam MultipartFile file就能拿到上传文件信息。后我直接使用uploadify的方式上传，接口没有做任何调整，上传的过程中报http400， 客户端的请求不符合接口的要求，表单post提交时报文参数是以Form Data方式，而换成uploadify时参数格式则是request payload的方式，所以把接口改写成MultipartServletRequest的方式
开发环境
SpringMVC4、Uploadify、
上传文件的话还需要下载 commons-fileupload ，同时还会下载common-io、common-logging
项目结构
普通表单上传
<form action="/User/index" method="post" enctype="multipart/form-data"> <input type="file" name="file"> <input type="submit" value="upload"/> </form>
@RequestMapping("upload")
public @ResponseBody String upload(@RequestParam MultipartFile file) throws IOException {
String path =request.getSession().getServletContext().getRealPath("upload");
File file=new File(path,file.getOriginalFilename());
file.transferTo(file); //保存文件
return "/success";
}
uploadify上传文件
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Index</title>
<link href="/2sc/uploadify/uploadify.css" rel="external nofollow" rel="stylesheet" type="text/css" />
<script src="/2sc/js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="/2sc/uploadify/jquery.uploadify.js" type="text/javascript"></script>
<style type="text/css">
#fileQueue {position: absolute;bottom: 0;right: 0;}
</style>
</head>
<body>
spring mvc 上传文件
<div id="fileQueue">
</div>
<input type="file" name="uploadify" id="uploadify" />
<script type="text/javascript">
$(function () {
$("#uploadify").uploadify({
'method':'post',
//指定swf文件
'swf': '/2sc/uploadify/uploadify.swf',
//后台处理的页面
'uploader': '/User/upload',
//按钮显示的文字
'buttonText': '上传图片',
//显示的高度和宽度，默认 height 30；width 120
//'height': 15,
//'width': 80,
//上传文件的类型 默认为所有文件 'All Files' ; '*.*'
//在浏览窗口底部的文件类型下拉菜单中显示的文本
'fileTypeDesc': 'Image Files',
//允许上传的文件后缀
'fileTypeExts': '*.gif; *.jpg; *.png',
//发送给后台的其他参数通过formData指定
'formData': { 'someKey': 'someValue'},
//上传文件页面中，你想要用来作为文件队列的元素的id, 默认为false 自动生成, 不带#
'queueID': 'fileQueue',
//选择文件后自动上传
'auto': true,
//设置为true将允许多文件上传
'multi': true
});
});
</script>
</body>
</html>
接口
@RequestMapping(value = "/upload",method = RequestMethod.POST)
public @ResponseBody String upload(HttpServletRequest request, HttpServletResponse response){
String path =request.getSession().getServletContext().getRealPath("upload");
MultipartHttpServletRequest multipartHttpServletRequest=(MultipartHttpServletRequest)request;
Map<String,MultipartFile> map = multipartHttpServletRequest.getFileMap();
System.out.println("path:"+path);
File file=new File(path);
if(!file.exists()){
file.mkdirs();
}
try{
for(Map.Entry<String,MultipartFile> entity:map.entrySet()){
MultipartFile multipartFile=entity.getValue();
File ff = new File(path,multipartFile.getOriginalFilename());
multipartFile.transferTo(ff);
}
return "success";
}catch (Exception e){
e.printStackTrace();
return "error";
}
}
总结
以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流，谢谢大家对我们的支持。
相关推荐
-
springMvc注解之@ResponseBody和@RequestBody详解
简介 springmvc对json的前后台传输做了很好封装,避免了重复编码的过程,下面来看看常用的@ResponseBody和@RequestBody注解 添加依赖 springmvc对json的处理依赖jackson <dependency> <groupId>org.codehaus.jackson</groupId> <artifactId>jackson-core-asl</artifactId> <version>1.9.1
-
SpringMVC自定义属性编辑器详解及实例
SpringMVC自定义属性编辑器详解及实例 自定义springMVC的属性编辑器主要有两种方式,一种是使用@InitBinder标签在运行期注册一个属性编辑器,这种编辑器只在当前Controller里面有效:还有一种是实现自己的 WebBindingInitializer,然后定义一个AnnotationMethodHandlerAdapter的bean,在此bean里面进行注册 ,这种属性编辑器是全局的. 第一种方式: import java.beans.PropertyEditorSupp
-
SpringMVC中MultipartFile上传获取图片的宽度和高度详解
SpringMVC一般使用MultipartFile来做文件的上传,通过MultipartFile的getContentType()方法判定文件的类型(MIME) ".doc":"application/msword" ".jpg":"image/jpeg" ".jpeg":"image/jpeg" ".png":"image/png" -. 有时
-
Spring+SpringMVC+MyBatis深入学习及搭建(一)之MyBatis的基础知识
1.对原生态jdbc程序中问题总结 1.1 jdbc程序 需求:使用jdbc查询mysql数据库中用户表的记录 statement:向数据库中发送一个sql语句 预编译statement:好处:提高数据库性能. 预编译statement向数据库中发送一个sql语句,数据库编译sql语句,并把编译的结果保存在数据库砖的缓存中.下次再发sql时,如果sql相同,则不会再编译,直接使用缓存中的. jdbc编程步骤: 1. 加载数据库驱动 2. 创建并获取数据库链接 3. 创建jdbc statemen
-
SpringMVC+bootstrap table实例详解
bootstrap-table下载地址:https://github.com/wenzhixin/bootstrap-table/ 先来看一张效果图: 下载下来后,需要导入的css:由于需要bootstrap的支持,所以需要导入bootstrap的css <!-- Bootstrap --> <link href="${contextPath }/static/bootstrap/css/bootstrap.min.css" rel="external no
-
SpringMVC4 + MyBatis3 + SQL Server 2014整合教程（含增删改查分页）
前言 说起整合自然离不开ssm,我本身并不太喜欢ORM,尤其是MyBatis,把SQL语句写在xml里,尤其是大SQL,可读性不高,出错也不容易排查. 开发环境 idea2016.SpringMVC4.Mybatis3 项目结构 SSM整合 1.pom.xml <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance&qu
-
SpringMVC + jquery.uploadify实现上传文件功能
前言 以前用Asp.net MVC+uploadify上传文件,最近学习SpringMVC,所以就用SpringMVC+uploadify做个上传文件的demo. 刚开始用form表单的方式提交,在Controller Action中用@RequestParam MultipartFile file就能拿到上传文件信息.后我直接使用uploadify的方式上传,接口没有做任何调整,上传的过程中报http400, 客户端的请求不符合接口的要求,表单post提交时报文参数是以Form Data方式,
-
使用WebUploader实现分片断点上传文件功能（二）
写在前面: 这几天,有去研究一下WebUploader上传文件,前面的博客有记录下使用WebUploader简单上传文件的例子,今天就把分片断点上传的例子也记录下吧,在博客园中,也查看了一些资料,基本上后台处理数据都是用的Servlet,或者是SpringMVC,由于最近的项目一直都是Struts2,所以这里就用Struts2中的action来对数据进行处理,达到分片上传文件的效果. 1.什么是分片上传? 顾名思义,就是把文件分成一片片,即让一个文件,分割成好几个小文件,然后再上传.这样做的好处
-
ASP.NET插件uploadify批量上传文件完整使用教程
uploadify批量上传文件完整使用教程,供大家参考,具体内容如下 1.首先准备uploadify的js文件,网上一搜一大堆 2.上传页面UpFilePage.aspx 关键代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/h
-
使用WebUploader实现上传文件功能（一）
写在前面: 文件上传方式很多的,对于大文件的上传,在本次项目中也有涉及,主要是用了分片断点上传大文件.所以就去了解了一下WebUploader,先从简单的上传文件开始吧. 在代码中写注释,这样看的比较好点,那就直接上代码来看了解实现的过程吧. 前台jsp页面: <%@ page contentType="text/html;charset=UTF-8" language="java" %> <% String scheme = request.ge
-
使用Spring Boot上传文件功能
上传文件是互联网中常常应用的场景之一,最典型的情况就是上传头像等,今天就带着带着大家做一个Spring Boot上传文件的小案例. 1.pom包配置 我们使用Spring Boot最新版本1.5.9.jdk使用1.8.tomcat8.0. <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId>
-
PHP+iframe模拟Ajax上传文件功能示例
本文实例讲述了PHP+iframe模拟Ajax上传文件功能.分享给大家供大家参考,具体如下: 在xmlhttprequest level 1中,Ajax是不能够上传文件的,因为js不能操作本地文件,但是市场上有一些Ajax异步上传文件的插件,是怎么完成的呢?答案:可以使用iframe模拟Ajax上传文件.接下来博主将使用iframe来模拟Ajax来上传文件. 首先看一下效果图: 文件结构图: 09-iframe-upload.html文件: 页面中有一个表单,表单中有一个上传文件按钮和提交按钮,
-
ajaxfileupload.js实现上传文件功能
使用ajaxfileupload.js实现上传文件功能 一.ajaxFileUpload是一个异步上传文件的jQuery插语法:$.ajaxFileUpload([options]) options参数说明: 1.url 上传处理程序地址 2.fileElementId 文件选择框的id属性,即的id 3.secureuri 是否启用安全提交,默认为false 4.dataType 服务器返回的数据类型.可以为xml,script,json,html.如果不填写,jQuery会自动判断 5.su
-
php+iframe 实现上传文件功能示例
本文实例讲述了php+iframe 实现上传文件功能.分享给大家供大家参考,具体如下: 我们通过动态的创建iframe,修改form的target,来实现无跳转的文件上传. 具体的实现步骤 1.捕捉表单提交事件 2.创建一个iframe 3.修改表单的target,指向iframe 4.删除iframe file.html代码如下: <!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta charset
-
ajax实现无刷新上传文件功能
本文实例为大家分享了ajax实现无刷新上传文件功能的具体代码,供大家参考,具体内容如下 详细代码如下 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>ajax无刷新上传文件</title> <script> window.o
-
hadoop上传文件功能实例代码
hdfs上的文件是手动执行命令从本地linux上传至hdfs的.在真实的运行环境中,我们不可能每次手动执行命令上传的,这样太过繁琐.那么,我们可以使用hdfs提供的Java api实现文件上传至hdfs,或者直接从ftp上传至hdfs. 然而,需要说明一点,之前笔者是要运行MR,都需要每次手动执行yarn jar,在实际的环境中也不可能每次手动执行.像我们公司是使用了索答的调度平台/任务监控平台,可以定时的以工作流执行我们的程序,包括普通java程序和MR.其实,这个调度平台就是使用了quart