多文件分布式上传-SpringBoot

亦凉 2023-10-10 20:17 43阅读 0赞

### 前言 ###

在现代化的互联网应用中，各种形式的上传都成为了必备的功能之一。而对于大文件上传以及多文件上传来说，我们往往需要考虑分布式储存的方案，以实现高效和可扩展性。

本文将详细介绍在SpringBoot中实现多文件分布式上传的方法，我们将使用一个开源软件FastDFS作为我们的分布式储存方案。

### 实现思路 ###

在实现多文件分布式上传之前，我们需要了解一些必要的预备知识和技术：

*  FastDFS - 一款开源的轻量级分布式文件系统。
 *  SpringBoot - 基于Java的轻量级Web开发框架。
 *  Thymeleaf - 基于Java的模板引擎。

我们将使用SpringBoot作为我们的后端开发框架，采用Thymeleaf模板引擎作为我们的前端展示。而FastDFS则作为我们的分布式储存方案。

总体的实现思路步骤如下：

1.  前端页面通过SpringBoot后端暴露的RESTful接口，向FastDFS服务器上传文件。
2.  后端接收到前端上传的文件，并通过FastDFS上传至储存服务器。
3.  后端返回文件的储存路径，以供前端进行展示。

### 环境准备 ###

在进行实现之前，我们需要对环境进行一些准备。

首先，我们需要下载和安装FastDFS，在此不再赘述。其次，我们需要添加如下依赖至项目的`pom.xml`文件中：

<dependency>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-web</artifactId>
    </dependency>
    
    <dependency>
    	<groupId>org.csource</groupId>
    	<artifactId>fastdfs-client-java</artifactId>
    	<version>1.29-SNAPSHOT</version>
    	<exclusions>
    		<exclusion>
    			<artifactId>log4j-api</artifactId>
    			<groupId>org.apache.logging.log4j</groupId>
    		</exclusion>
    		<exclusion>
    			<artifactId>log4j-core</artifactId>
    			<groupId>org.apache.logging.log4j</groupId>
    		</exclusion>
    	</exclusions>
    </dependency>
    
    <dependency>
    	<groupId>org.springframework.boot</groupId>
    	<artifactId>spring-boot-starter-thymeleaf</artifactId>
    </dependency>

其中，`fastdfs-client-java`是FastDFS的Java客户端，`spring-boot-starter-web`作为SpringBoot中Web项目的起步依赖，`spring-boot-starter-thymeleaf`是Thymeleaf模板引擎的依赖。

为了方便管理FastDFS服务器的配置，在项目的`resources`目录下新建一个名为`fdfs_client.conf`的文件，添加如下配置：

# 连接超时时间（单位：毫秒）
    connect_timeout=600
    # 网络超时时间（单位：毫秒）
    network_timeout=1200
    # 编码字符集
    charset=UTF-8
    # HTTP访问服务的端口号
    http.tracker_http_port=8888
    # HTTP访问服务的IP地址（需要填写Tracker服务的地址）
    http.tracker_http_ip=tracker:80
    # Tracker服务器列表，多个tracker使用半角逗号分隔
    tracker_server=tracker:22122

其中，`tracker_http_ip`和`tracker_server`需要根据实际情况进行配置。

### 实现步骤 ###

#### 1. 前端页面的实现 ####

在`src/main/resources/templates`目录下新建一个`index.html`文件，作为我们的前端页面，添加如下代码：

<!DOCTYPE html>
    <html lang="en"
          xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>SpringBoot Multiple File Upload</title>
    </head>
    <body>
        <form th:action="@{/upload}" method="post" enctype="multipart/form-data">
            <input type="file" name="files" multiple>
            <button type="submit">Upload</button>
        </form>
    </body>
    </html>

在该页面中，我们向用户展示了一个用于文件选择的`<input>`表单和一个用于提交用户选择的文件的`<button>`按钮。当用户点击提交按钮时，我们将利用SpringBoot后端暴露的`/upload`接口向FastDFS服务器上传文件。

#### 2. 后端接口的实现 ####

在SpringBoot中，我们可以使用`@RestController`注解定义一个RESTful风格的Web服务，用于接收前端的请求。

在`src/main/java`目录下新建一个`UploadController.java`文件，并添加如下代码：

package com.example.upload.controller;
    
    import org.csource.common.MyException;
    import org.csource.fastdfs.*;
    import org.slf4j.Logger;
    import org.slf4j.LoggerFactory;
    import org.springframework.beans.factory.annotation.Value;
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.Model;
    import org.springframework.web.bind.annotation.PostMapping;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestParam;
    import org.springframework.web.multipart.MultipartFile;
    
    import java.io.IOException;
    
    @Controller
    public class UploadController {
        
    
        private final Logger logger = LoggerFactory.getLogger(this.getClass());
    
        @Value("${fdfs.conf.path}")
        private String fdfsConfPath;
    
        @RequestMapping("/")
        public String index() {
        
            return "index";
        }
    
        @PostMapping("/upload")
        public String handleFileUpload(@RequestParam("files") MultipartFile[] files, Model model) {
        
            try {
        
                // 加载FastDFS的配置文件
                ClientGlobal.init(fdfsConfPath);
    
                // 创建TrackerClient
                TrackerClient trackerClient = new TrackerClient();
    
                // 获取TrackerServer
                TrackerServer trackerServer = trackerClient.getConnection();
    
                // 获取StorageServer
                StorageServer storageServer = trackerClient.getStoreStorage(trackerServer);
    
                // 创建StorageClient
                StorageClient storageClient = new StorageClient(trackerServer, storageServer);
    
                String[] result = null;
    
                for (MultipartFile file : files) {
        
                    // 获取文件名称
                    String originalFilename = file.getOriginalFilename();
    
                    // 获取文件扩展名
                    String extName = originalFilename.substring(originalFilename.lastIndexOf(".") + 1);
    
                    // 执行上传
                    result = storageClient.upload_file(file.getBytes(), extName, null);
    
                    logger.info("文件上传成功，储存路径为：" + result[0] + "/" + result[1]);
    
                    model.addAttribute("message", "文件上传成功");
                    model.addAttribute("path", result[0] + "/" + result[1]);
                }
            } catch (IOException | MyException e) {
        
                logger.error("文件上传失败", e);
    
                model.addAttribute("message", "文件上传失败");
            }
    
            return "result";
        }
    }

在上述代码中，我们使用了`@Value`注解注入了FastDFS的配置文件路径。在`handleFileUpload`方法中，我们使用FastDFS客户端进行了文件上传，并通过SpringBoot后端向前端返回了文件的储存路径。如果上传失败，则返回上传失败信息。

除此之外，我们还在`index()`方法中定义了访问`/`路径时返回的页面，并在`handleFileUpload`方法中定义了访问`/upload`路径时的上传接口。

#### 3. 前端展示页面的实现 ####

在`src/main/resources/templates`目录下新建一个`result.html`文件，作为文件上传成功后的页面，添加如下代码：

<!DOCTYPE html>
    <html lang="en"
          xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="UTF-8">
        <title>Upload Result</title>
    </head>
    <body>
        <h1 th:text="${message}"></h1>
        <p th:text="${path}"></p>
    </body>
    </html>

在该页面中，我们使用了Thymeleaf模板引擎的语法，动态地向用户展示上传结果，并展示了文件的储存路径。

至此，我们的多文件分布式上传功能实现完毕。

### 总结 ###

本文详细介绍了如何在SpringBoot中实现多文件分布式上传，并用代码给出了相应的实现思路和实现步骤。通过本文的学习，读者可以了解到如何使用FastDFS作为分布式文件储存方案，如何在SpringBoot中搭建RESTful接口，以及如何使用Thymeleaf模板引擎进行前端展示。希望本文能够对您有所帮助！

完整代码请参考文末的GitHub链接。

### 参考资料 ###

*  [FastDFS官网][FastDFS]
 *  [SpringBoot官网][SpringBoot]
 *  [Thymeleaf官网][Thymeleaf]
 *  [官方示例][Link 1]
 *  [SpringBoot文件上传示例][SpringBoot 1]

[FastDFS]: https://github.com/happyfish100/fastdfs
[SpringBoot]: https://spring.io/projects/spring-boot
[Thymeleaf]: https://www.thymeleaf.org/
[Link 1]: https://github.com/happyfish100/fastdfs-client-java/blob/master/src/main/java/org/csource/fastdfs/demo/ClientTest.java
[SpringBoot 1]: https://spring.io/guides/gs/uploading-files/