Spring Boot 实现图片上传功能（最全，亲测有效！）

港控/mmm° 2022-12-21 13:54 154阅读 0赞

今天用Spring boot编写一个文件上传功能，本来自信满满，觉得简单，实际做起来发现报各种错，百度上的好多解决办法都是复制粘贴，没一个靠谱的，经过我的东凑西补最终完美实现上传功能。

一、导入jar包

<dependency>
                <groupId>commons-fileupload</groupId>
                <artifactId>commons-fileupload</artifactId>
                <version>1.3.1</version>
            </dependency>

二、编写上传类

package com.xiateng.util;
    
    import com.xiateng.dao.user.TPictureMapper;
    import com.xiateng.entity.TPicture;
    import com.xiateng.entity.TUser;
    import com.xiateng.interceptor.SessionInterceptor;
    import org.apache.commons.fileupload.FileItem;
    import org.apache.commons.fileupload.disk.DiskFileItemFactory;
    import org.apache.commons.fileupload.servlet.ServletFileUpload;
    import org.json.JSONObject;
    import org.slf4j.Logger;
    import org.slf4j.LoggerFactory;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.web.multipart.MultipartFile;
    import org.springframework.web.multipart.MultipartHttpServletRequest;
    
    import javax.jws.WebService;
    import javax.servlet.ServletConfig;
    import javax.servlet.ServletContext;
    import javax.servlet.ServletException;
    import javax.servlet.annotation.WebServlet;
    import javax.servlet.http.HttpServlet;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.File;
    import java.io.IOException;
    import java.io.PrintWriter;
    import java.util.Date;
    import java.util.List;
    
    /**
     * 图片上传代码
     * Created by Administrator on 2020/11/15.
     */
    @WebServlet(urlPatterns = "/uploadServlet")
    public class UploadServlet extends HttpServlet {
    
        @Autowired
        private TPictureMapper tPictureMapper;
        private static final Logger logger = LoggerFactory.getLogger(SessionInterceptor.class);
        private static final long serialVersionUID = 1L;
    
        /**
         * @see HttpServlet#HttpServlet()
         */
        public UploadServlet() {
            super();
            // TODO Auto-generated constructor stub
        }
    
        @Override
        public void init(ServletConfig config) throws ServletException {
            // TODO Auto-generated method stub
            super.init();
        }
    
        /**
         * @see HttpServlet#doGet(javax.servlet.http.HttpServletRequest request, javax.servlet.http.HttpServletResponse
         *      response)
         */
        protected void doGet(HttpServletRequest request,
                             HttpServletResponse response) throws ServletException, IOException {
            response.setHeader("Access-Control-Allow-Origin","http://localhost:3000");
            response.setHeader("Access-Control-Allow-Credentials", "true");
    
            request.setCharacterEncoding("utf-8"); // 设置编码
            response.setCharacterEncoding("utf-8");
            response.setContentType("text/html;charset=UTF-8");
            // 获得磁盘文件条目工厂
            DiskFileItemFactory factory = new DiskFileItemFactory();
    
            // 如果没以下两行设置的话，上传大的 文件 会占用 很多内存，
            // 设置暂时存放的 存储室 , 这个存储室，可以和 最终存储文件 的目录不同
            /**
             * 原理 它是先存到 暂时存储室，然后在真正写到 对应目录的硬盘上， 按理来说 当上传一个文件时，其实是上传了两份，第一个是以 .tem
             * 格式的 然后再将其真正写到 对应目录的硬盘上
             */
            factory.setRepository(new File(StaticConst.TEMP_FOLDER1));
            // 设置 缓存的大小，当上传文件的容量超过该缓存时，直接放到 暂时存储室
            factory.setSizeThreshold(1024 * 1024);
    
            // 高水平的API文件上传处理
            ServletFileUpload upload = new ServletFileUpload(factory);
    
            try {
                // 提交上来的信息都在这个list里面
                // 这意味着可以上传多个文件
                // 请自行组织代码
                List<FileItem> list = upload.parseRequest(request);
                // 获取上传的文件
                FileItem item = getUploadFileItem(list);
                // 获取文件名
                String filename = getUploadFileName(item);
                // 保存后的文件名
                String saveName = new Date().getTime() + "_"+filename;
                logger.info("保存后的文件名:" + saveName);
                // 保存后图片的浏览器访问路径
                String picUrl = StaticConst.PATH_FOLDER1.replace("\\","/")+"/"+saveName;
                logger.info("存放目录:" + StaticConst.PATH_FOLDER1);
                logger.info("文件名:" + filename);
                logger.info("浏览器访问路径:" + picUrl);
    
                // 真正写到磁盘上
                item.write(new File(StaticConst.PATH_FOLDER1, saveName)); // 第三方提供的
                PrintWriter writer = response.getWriter();
                logger.info("{");
                logger.info("uploadedFile:"+ "\"" + filename + "\"");
                logger.info(",uploadedFileGetUrl:\"" + picUrl + "\"");
                logger.info("}");
    
                JSONObject result = new JSONObject();
                result.put("uploadedFile", filename);
                result.put("code",200);
                result.put("uploadedFileGetUrl", picUrl);
                writer.write(result.toString());
                writer.close();
            } catch (Exception e) {
                e.printStackTrace();
            }
        }
    
        private FileItem getUploadFileItem(List<FileItem> list) {
            for (FileItem fileItem : list) {
                if (!fileItem.isFormField()) {
                    return fileItem;
                }
            }
            return null;
        }
    
        private String getUploadFileName(FileItem item) {
            // 获取路径名
            String value = item.getName();
            System.out.println(value + ":value");
            // 索引到最后一个反斜杠
            int start = value.lastIndexOf("/");
            // 截取 上传文件的 字符串名字，加1是 去掉反斜杠，
            String filename = value.substring(start + 1);
            return filename;
        }
    
        /**
         * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse
         *      response)
         */
        protected void doPost(HttpServletRequest request,
                              HttpServletResponse response) throws ServletException, IOException {
            doGet(request, response);
        }
    
    }

这一步需要注意：ServletFileUpload 跟 DiskFileItemFactory 类别引错包了，要用commons-fileupload包里的，  
我开始一直报错：nested exception is java.lang.NoClassDefFoundError: org/apache/commons/fileupload/disk/DiskFileItemFactory，报错原因是我用的tomcat-embed-core里的类

静态常量类：

public class StaticConst {
    
        public static final String PATH_FOLDER = "F:\\uploadImage\\tengJun";
    
        public static final String TEMP_FOLDER = "F:\\uploadImage\\preFile";
    
        public static final String PATH_FOLDER1 = "D:\\uploadImage\\tengJun";
    
        public static final String TEMP_FOLDER1 = "D:\\uploadImage\\preFile";
    }

第三步：启动类添加servlet注解扫描

![20201116145854911.png][]

第四步：前端代码

<input type="file" class="form-control" id="fileCont" name="file" >
    
    
    <script>
        $('#fileCont').on('change',function(){
            var fileObj = $(this)[0].files[0];
            var formFile = new FormData();
            //加入文件对象,向接口传入两个参数file,id
            formFile.append("file", fileObj);
              $.ajax({
                  url:"/uploadServlet",
                  data: formFile,
                  type: "POST",
                  dataType: "json",
                  //上传文件无需缓存
                  cache: false,
                  //用于对data参数进行序列化处理 这里必须false
                  processData: false,
                  //必须
                  contentType: false,
                  success: function (res) {
                      if(res.code === 200){
                          alert("成功");
                      }else{
                          alert("失败");
                      }
                  },
              })
        })
    </script>

大功告成！！！

[20201116145854911.png]: /images/20221120/6781ec1c65a847e0a464a9d693f09c83.png