刚开始实习就接了个项目,开始跟着公司“老人”做项目,刚开始时,老人们定下了项目使用框架,什么也没说,只是给我们发了框架,让我们自己研究,花了一天时间,终于研究懂了点,页面前端使用extjs,后台是spring mvc,虽然自己以前从未用过这玩意,但是老人们说了,框架是拿来用的,不是现在用来学习的,我就照猫画虎的做了些练习,最后也跟上的项目进度。下面把自己在项目中做的Extjs+spring mvc 实现的文件上传和下载部分跟大家共享一下。
用户必须能够上传图片,因此需要文件上传的功能。比较常见的文件上传组件有Commons FileUpload和COS FileUpload,Spring已经完全集成了这两种组件,对应的包分别是:
Package org.springframework.web.multipart.commons
和
Package org.springframework.web.multipart.cos
当是我用的是Commons FileUpload
Extjs代码:
var addForm = new Ext.FormPanel({ //构造一个新增form layout: 'form', labelWidth: 90, frame:true, bodyStyle:'padding:5px 5px 0', defaults: {width: 200}, defaultType: 'textfield', fileUpload: true, method:'POST', enctype:'multipart/form-data', items:addItems }); var addItems = { fieldLabel: '上传文件', inputType:'file', id:'fileRes', name:'fileRes', allowBlank:false, blankText: '文件不能为空!', } var doSave=function(){ var fileFullName = Ext.getCmp("fileRes").getValue();//上传文件全名 var startfile = fileFullName.lastIndexOf(".")+parseInt(1); var fileType = fileFullName.substring(startfile).toUpperCase();//截取文件后缀 alert(fileType); var fileKey = Ext.getCmp("fileTypeComb").getValue(); var Index = fileTypeStore.find("selectKey",fileKey); var fileValue = ""; if(Index!=-1){ //通过索引取得记录ds中的记录集 var TypeRecord = fileTypeStore.getAt(Index); //返回记录集中的value字段的值 fileValue = TypeRecord.data.selectName; //获取选择的文件类型 } if(fileValue == fileType){ addForm.form.submit({ url : '<%=basePath%>FileResAction.do?method=create&fullFileName='+encodeURI(encodeURI(fileFullName)), method : 'post', waitMsg:'文件正在保存中...', params : {useAjax:'yes',submit:submitBy,fileRes:fileFullName,enctype:'multipart/form-data'}, failure : function(form, action) { Ext.MessageBox.alert('提示信息', '保存失败,可能网络超时,请重新登录'); }, success : function(form, action) { Ext.MessageBox.alert('提示信息', '数据保存成功'); addWin.hide(); store.load({params:{start:0,limit:pageSize}}); }, scope:this }) }else{ Ext.MessageBox.alert('提示信息', '上传类型不符合文件类型'); } }; }
上面其实没这么复杂,我是复制过来的,大概意思就是创建一个form,form里有上传文件控件,注意设置 enctype:'multipart/form-data', 然后传送到后台action处理。
xxx-servlet.xml配置
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize"><value>30000000000</value></property> </bean>
action类代码:
@RequestMapping(params = "method=create") public void create(FileResVO entiyVO,HttpServletRequest request, HttpServletResponse response) throws Exception { response.setContentType("text/html;charset=utf-8"); String id = request.getParameter("code"); String submitBy = request.getParameter("submit").trim(); entiyVO.setSubmit_by(submitBy); MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;//将HttpServletRequest对象转换为MultipartHttpServletRequest对象 SimpleDateFormat dateformat = new SimpleDateFormat("yyyyMMdd"); /**构建文件保存的目录**/ String logoPathDir = "/resource/file/"+ dateformat.format(new Date()); /**得到文件保存目录的真实路径**/ String logoRealPathDir = request.getSession().getServletContext().getRealPath(logoPathDir); /**根据真实路径创建目录**/ File logoSaveFile = new File(logoRealPathDir); if(!logoSaveFile.exists()) { logoSaveFile.mkdirs(); } /**页面控件的文件流**/ MultipartFile multipartFile = multipartRequest.getFile("fileRes"); /**上传文件名称**/ String logImageName = multipartFile.getOriginalFilename();// /**获取文件的后缀**/ String suffix = multipartFile.getOriginalFilename().substring(multipartFile.getOriginalFilename().lastIndexOf(".")+1); // 文件类型 // 获取文件大小,以kB为单位 long size = multipartFile.getSize(); Double fSize =Math.round(size/1024.0*100)/100.0; String fileSize = Double.toString(fSize)+"KB"; entiyVO.setFile_size(fileSize); /**拼成完整的文件保存路径加文件**/ String fileName = logoRealPathDir + File.separator + logImageName; entiyVO.setUrl(fileName); File file = new File(fileName); try { multipartFile.transferTo(file); //将文件写入到指定的目录 } catch (IllegalStateException e) { e.printStackTrace(); } catch (IOException e) { e.printStackTrace(); } if(null == id || "".equals(id)){//提交文件 FileResService.createFileRes(entiyVO); }else{//修改文件 FileResService.updateFileRes(entiyVO); } }
编译过程中可能会出现两种异常:nullpointerexception 和 类类型无法匹配(HttpServletRequest对象无法转换为multipartHttpServletRequest对象),若出现,分别是页面文件输入框name属性的值和action类接受参数名称一致,form表单的 enctype:'multipart/form-data'; 类类型无法匹配问题:设置表单 fileUpload: true,检查xml配置文件。
Spring Api 链接地址: http://static.springsource.org/spring/docs/2.0.x/api/overview-summary.html#overview_description