spring mvc 图片异步上传

xiaoxiao2021-02-28  96

配置springmvc-config.xml文件 <!-- 文件上传控制 --> <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver" p:defaultEncoding="UTF-8"> <property name="maxUploadSize"> <value>104857600</value> </property> <property name="maxInMemorySize"> <value>4096</value> </property> </bean> 2.前端部分 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@include file="../common/common.jsp"%> <!DOCTYPE html > <html> <head> <base href="<%=basePath%>"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>文件上传</title> </head> <body> <div> <input type="hidden" id="imgUrl" > <input type="file" name="file" id="myImg"/> <input type="button" value="提交" id="upBt"> </div> <div id="showImg"> </div> </body> <script src="js/jquery-1.10.2.min.js"></script> <script src="js/ajaxfileupload.js"></script> <script src="js/public/fileUtils.js"></script> <script type="text/javascript"> var imgPath = 'http://www.redwheelcc.com/upload/'; $(function(){ showImg(); }); //选中图片时,展示图片 function showImg(){ $("#myImg").on("change",function(){ // 调用文件上传方法 文件标签id,上传路径,上传文件夹,展示位置,记录url位置 fileHandle.uploadHead("myImg", "fileUpload/imgUpload", "img/test", "showImg", "imgUrl"); }); } </script> </html>

3.Controller层

import java.io.File; import java.util.Date; import java.util.HashMap; import java.util.Map; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import org.apache.commons.lang.StringUtils; import org.apache.log4j.Logger; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.multipart.MultipartFile; import com.appear.rwForklift.common.constant.Constant; import com.appear.rwForklift.common.utils.HtmlUtils; import com.appear.rwForklift.common.utils.Md5; /** * 文件上传 * @author APPEAR * */ @Controller @RequestMapping("fileUpload") public class FileUploadController { private final static Logger log = Logger.getLogger(FileUploadController.class); private final static String SUCCESS = "success"; /** * 图片上传服务器 并返回图片路径 */ @RequestMapping("imgUpload") @ResponseBody public void imgUpload(@RequestParam(value = "file", required = true) MultipartFile file, @RequestParam(value = "folderName", required = true) String folderName, HttpServletRequest request, HttpServletResponse response) { try { // 获取文件名称 String fileName = file.getOriginalFilename(); // 文件名称处理 fileName = handlerFileName(fileName); log.debug("图片上传fileName=" + fileName); File targetFile = new File(Constant.PICTURE_URL + folderName, fileName); if (!targetFile.exists()) { targetFile.mkdirs(); } // 将上传文件写到服务器上指定的文件。 file.transferTo(targetFile); // 设置页面数据 Map<String, Object> jsonMap = new HashMap<String, Object>(); jsonMap.put(SUCCESS, true); jsonMap.put("imgUrl", folderName + File.separator + fileName); HtmlUtils.jsonToHtml(response, jsonMap); } catch (Exception ex) { ex.printStackTrace(); //this.sendFailureMessage(response, SpringmvcExceptionHandler.getExceptionMsg(ex)); } } /** * 文件名称处理 */ private String handlerFileName(String fileName) { // 处理名称start fileName = (new Date()).getTime() + "_" + fileName; // 时间戳+文件名,防止覆盖重名文件 String pre = StringUtils.substringBeforeLast(fileName, "."); String end = StringUtils.substringAfterLast(fileName, "."); fileName = Md5.encrypt(pre) + "." + end;// 用MD5编码文件名,解析附件名称 // 处理名称end return fileName; } }

未完,待续…

转载请注明原文地址: https://www.6miu.com/read-64212.html

最新回复(0)