Day06_07_SpringBoot教程之实现文件上传

朴灿烈づ我的快乐病毒、 2024-01-15 06:19 33阅读 0赞

## 在SpringBoot项目中实现文件上传 ##

### 一. 概述 ###

在实际的企业开发中,文件上传是比较常见的功能之一.而SpringBoot没有自己的文件上传技术,是依赖于SpringMVC的文件上传技术.在SpringBoot中集成了SpringMVC常用的功能,当然也包含了文件上传的功能,实现起来没有太多的区别.接下来我们通过示例展示下文件上传在Springboot项目中的实现.

1. MultipartFile的API方法

在SpringMvc时代,其提供了MultipartFile这个封装类,它包含了文件的二进制流和文件相关属性(文件名、大小等),所以在SpringBoot中也是使用此封装类进行文件上传的.而MultipartFile是个接口,它的实现类有`CommonsMultipartFile`和`StandardMultipartFile`,这里简单说明下:

1️⃣. `CommonsMultipartFile`: 是基于`apache fileupload`的解析;

2️⃣. `StandardMultipartFile`: 是基于j2ee自带的文件上传进行解析,即使用Servlet3.0提供的`javax.servlet.http.Part`上传方式.

我们在正常使用MultipartFile时,无需关心底层是以哪种方式进行文件上传处理的,SpringMVC会给我们做相应的转换.

byte[] getBytes(): 获取文件数据;
    String getContentType(): 获取文件MIME类型,如application/pdf、image/pdf等;
    InputStream getInputStream(): 获取文件流;
    String getOriginalFileName(): 获取上传文件的原名称;
    long getSize(): 获取文件的字节大小,单位为byte;
    boolean isEmpty(): 是否上传的文件是否为空;
    void transferTo(File dest): 将上传的文件保存到目标文件中

2. 注意:

要想实现文件上传,必须将表单的method设置为post,并将enctype设置为`multipart/form-data`.只有这样,浏览器才会把用户所选择文件的二进制数据发送给服务器.SpringMVC在文件上传时,会将上传的文件映射为MultipartFile对象,并对MultipartFile对象进行文件的解析和保存.

### 二. 使用SpringBoot上传单个文件 ###

#### 1. 在原有项目中创建一个新的module ####

![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70][]

#### 2. 在pom.xml文件中添加相关依赖包 ####

<dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
    
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>
    
        
        <dependency>
            <groupId>net.sourceforge.nekohtml</groupId>
            <artifactId>nekohtml</artifactId>
            <version>1.9.22</version>
        </dependency>
    
        
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
        </dependency>
    </dependencies>

#### 3. 创建文件上传的UploadController类 ####

package com.syc.boot.web;
    
    import com.syc.boot.domain.Message;
    import org.springframework.beans.factory.annotation.Value;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.PostMapping;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.ResponseBody;
    import org.springframework.web.multipart.MultipartFile;
    
    import java.io.File;
    import java.util.UUID;
    
    /**
     * 实现文件上传的控制器
     */
    @Controller
    public class UploadController {
    
        @Value("${file.uploadFolder}")
        private String  fileDir;
    
        @RequestMapping("/picUpload")
        public String picUpload(){
            //跳转到picUpload.html
            return "picUpload";
        }
    
        @ResponseBody
        @PostMapping("/upload")
        public Object upload(MultipartFile fileUpload){
            //获取文件名
            String fileName = fileUpload.getOriginalFilename();
            //获取文件后缀名
            String suffixName = fileName.substring(fileName.lastIndexOf("."));
            //重新生成文件名
            fileName = UUID.randomUUID()+suffixName;
            //指定本地文件夹存储图片
            try {
    
                System.out.println("------->>"+fileDir);
                File dir = new File(fileDir);
                if (!dir.exists()) {
                    dir.mkdirs();
                }
                File upload_file = new File(fileDir + fileName);
                fileUpload.transferTo(upload_file);
                return new Message(0,"success to upload");
            } catch (Exception e) {
                e.printStackTrace();
                return new Message(-1,"fail to upload");
            }
        }
    }

#### 4. 创建信息提示类Message ####

package com.syc.boot.domain;
    
    import lombok.AllArgsConstructor;
    import lombok.Data;
    import lombok.NoArgsConstructor;
    
    /**
     * 采用lombok简化bean
     */
    @Data
    @NoArgsConstructor
    @AllArgsConstructor
    public class Message {
    
        //0表示成功,-1表示失败
        int status;
    
        //向前端返回的内容
        String massage;
    
    }

#### 5. 配置application.properties ####

# Template mode to be applied to templates. See also StandardTemplateModeHandlers.
    spring.thymeleaf.mode=LEGACYHTML5
    
    spring.http.multipart.enabled=true
    spring.http.multipart.max-file-size=10MB
    spring.http.multipart.max-request-size=10MB
    
    #文件上传目录（注意Linux和Windows上的目录结构不同）
    #file.uploadFolder=/root/upload/
    #特别要注意此位置
    file.uploadFolder=E:/upload/

#### 6. 编写文件上传页面picUpload.html ####

<!DOCTYPE HTML>
    <html>
    <head>
        <title>pictureUploading</title>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    </head>
    <body>
    <form enctype="multipart/form-data" method="post" action="/upload">
        文件: <input type="file" name="fileUpload"/>
        <input type="submit" value="上传"/>
    </form>
    </body>
    </html>

#### 7. 应用程序入口类 ####

package com.syc.boot;
    
    import org.springframework.boot.SpringApplication;
    import org.springframework.boot.autoconfigure.SpringBootApplication;
    
    /**
     *
     */
    @SpringBootApplication
    public class UploadWebApplication {
    
        public static void main(String[] args) {
            SpringApplication.run(UploadWebApplication.class, args);
        }
    }

#### 8. 整个工程目录结构 ####

![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 1][]

#### 9. 运行程序,实现文件上传 ####

![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 2][]

### 二. 使用SpringBoot上传多个文件 ###

#### 1. 创建一个多文件上传的方法 ####

要实现多文件上传,可以在上面的controller中添加一个新的接口方法.

@RequestMapping(value = "/uploadMultifile", method = RequestMethod.POST)
        @ResponseBody
        public Object uploadMultiFile(@RequestParam("attachment") MultipartFile[] fileUpload) {
            
            try {
                for (int i=0;i<fileUpload.length;i++){
                    //获取文件名
                    String fileName = fileUpload[i].getOriginalFilename();
                    //指定本地文件夹存储图片
                    File dir = new File(fileDir);
                    if (!dir.exists()) {
                        dir.mkdirs();
                    }
                    if (fileUpload[i]!=null){
                        File upload_file = new File(fileDir + fileName);
                        fileUpload[i].transferTo(upload_file);
                    }
                }
                return new Message(0,"success to upload");
            } catch (Exception e) {
                e.printStackTrace();
                return new Message(-1,"fail to upload");
            }
            
        }

#### 2. 多文件上传的HTML界面 ####

<!DOCTYPE html>
    <html xmlns:th="http://www.thymeleaf.org">
    <head>
        <title>多文件上传</title>
        <meta charset="utf-8"/>
        <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"/>
    </head>
    
    <body>
    <div>
        <div>
            <div>
                <h3>多个文件上传</h3>
            </div>
            <div>
                <form  method="post" enctype="multipart/form-data" th:action="@{/uploadMultifile}">
                    <div>
                        <label for="attachment1">文件上传: </label>
                        <div>
                            <input type="file"  name="attachment" id="attachment1" placeholder="请选择邮件附件"/>
                        </div>
                    </div>
                    <div>
                        <label for="attachment2">文件上传: </label>
                        <div class="col-sm-5">
                            <input type="file"  name="attachment" id="attachment2" placeholder="请选择邮件附件"/>
                        </div>
                    </div>
                    <div>
                        <label for="attachment3">文件上传: </label>
                        <div>
                            <input type="file" name="attachment" id="attachment3" placeholder="请选择邮件附件"/>
                        </div>
                    </div>
    
                    <div>
                        <div>
                            <button type="submit">上 传</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    </body>
    
    </html>

#### 3. 多文件上传验证 ####

![Image 1][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 3][]  
最终实现在SpringBoot中的多文件上传功能.

### 三. 总结下文件上传的要点： ###

*  1️⃣. 表单method设置为post,并将enctype设置为 `multipart/form-data`;
 *  2️⃣. 文件映射为MultipartFile对象进行解析;
 *  3️⃣. 上传文件大小`spring.http.multipart.max-file-size`限制.

[Image 1]: 
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20190531132143132.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20190531132204157.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20190531135702524.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20190531135622531.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3N5YzAwMDY2Ng==,size_16,color_FFFFFF,t_70