欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

SpringMVC + jquery.uploadify实现上传文件功能

程序员文章站 2024-02-12 22:16:16
前言 以前用asp.net mvc+uploadify上传文件,最近学习springmvc,所以就用springmvc+uploadify做个上传文件的demo。 刚开...

前言

以前用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

项目结构

SpringMVC + jquery.uploadify实现上传文件功能

普通表单上传

<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 + jquery.uploadify实现上传文件功能

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对的支持。