图片上传对一些后台系统来讲,是一个比较常见的功能,我们有一个项目的后台项目是用html+JS开发的,今天在做后台系统的时候,需要做一些配置项的保存,涉及到图片上传,在Html页面中增加图片上传的代码:
Html页面需要引用一些js和css样式
JS中图片上传的代码如下:
$("#uploadfile").fileinput({ language: 'zh', //设置语言 allowedFileExtensions: ['jpg', 'png', 'gif'],//接收的文件后缀 uploadUrl: "提交数据的controller url", uploadAsync: false, //默认异步上传 showUpload: false, //是否显示上传按钮 showRemove: true, //显示移除按钮 showPreview: true, //是否显示预览 showCaption: true,//是否显示标题 maxFileSize: 800,//上传文件最大的尺寸 browseClass: "btn btn-primary", //按钮样式 dropZoneEnabled: false,//是否显示拖拽区域 enctype: 'multipart/form-data', validateInitialCount: true, uploadExtraData: function () { return InfoDlg.InfoData;//当前js页面收集数据的data对象 }, fileActionSettings: { showDrag: true, showRemove: true, showUpload: false, showZoom: false } }).on("filebatchuploadsuccess", function (event, data, previewId, index) { var response = data.response; if (response.code === 200) { Feng.info("保存成功!"); window.parent.xxxxxxxx.table.refresh();//父类页面刷新 InfoDlg.close();//当前配置页面关闭 } else { Feng.error("保存失败!" + response.message + "!"); } });
之前也做过很多次了,开发完成之后自测一下上传,图片上传之后,页面也有返显,但是在提交的时候报错了,看了一下日志,报了java.lang.ClassCastException: org.apache.shiro.web.servlet.ShiroHttpServletRequest cannot be cast to org.springframework.web.multipart.MultipartHttpServletRequest这个异常,
controller中代码如下:
@Permission @RequestMapping(value = "/add") @ResponseBody public Object add(Vo vo, HttpServletRequest request) { MultiValueMapmultiFileMap = ((MultipartHttpServletRequest) request).getMultiFileMap(); List uploadfile = multiFileMap.get("uploadfile"); if (uploadfile != null && uploadfile.size() != 0) { String img = ImgUtils.saveImg("img"); if (!img.equals("")) { vo.setImg(img); } else { return new ErrorTip(500, "图片保存失败"); } } return commonSubmit(vo); }
打了一下断点,看了一下,HttpServletRequest进来的时候,是ShiroHttpServletRequest,然后类转换异常了,看了一下别人提供的解决方法,有以下几种:
1.增加spring-mvc.xml配置
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize"> <value>104857600value> property> <property name="maxInMemorySize"> <value>4096value> property> bean>
2.将ShiroHttpServletRequest转换成commen httpRequest:
StandardServletMultipartResolver resolver = new StandardServletMultipartResolver();
MultipartHttpServletRequest multipartRequest = resolver.resolveMultipart(request);
3.form中添加参数:
enctype="multipart/form-data"