高效应对内存溢出!Spring Boot 3.3 大文件处理全攻略

开发 前端
本文深入探讨了如何在 Spring Boot3.3 中实现大文件分块处理与上传,通过分块的方式降低内存压力,并且结合 jQuery 前端实现了分块提交,利用 Bootstrap 进行用户上传状态的提示。

在现代应用程序中,处理大文件已成为一项常见需求,例如视频上传、数据迁移和日志分析等。然而,当处理超过内存容量的大文件时,可能会导致内存溢出(OutOfMemoryError)的问题,影响应用程序的稳定性和性能。传统的文件处理方式通常将整个文件加载到内存中,这在处理大文件时显然不可行。

为了解决这一挑战,我们需要采用高效的文件处理策略,例如分块处理和流式读取。这些方法可以有效降低内存占用,提高文件处理的效率。本文将深入探讨如何在 Spring Boot 3.3 中实现大文件的高效处理,包括分块上传、服务端分块保存,以及前端使用 jQuery 和 Bootstrap 实现分块上传的流程。

分块处理的流程介绍

分块处理是一种将大文件拆分为多个小块,逐个传输和处理的技术。其主要流程如下:

  1. 前端文件分块: 在客户端(浏览器)将大文件按照一定大小(如 1MB)进行拆分,生成多个文件块。
  2. 分块上传: 前端逐个将文件块通过 HTTP 请求上传到服务器,可以使用 AJAX 异步提交。
  3. 服务端接收并保存: 服务器接收到文件块后,按顺序将其保存到临时文件或直接写入目标文件,使用流式写入方式,避免占用过多内存。
  4. 合并文件块: 如果在临时目录保存,待所有文件块上传完成后,服务器将所有文件块按序合并为最终的完整文件。
  5. 返回上传结果: 服务器将上传结果以 JSON 格式返回给前端,前端根据结果进行相应的提示和处理。

运行效果:

图片图片

若想获取项目完整代码以及其他文章的项目源码,且在代码编写时遇到问题需要咨询交流,欢迎加入下方的知识星球。

项目结构

src
├── main
│   ├── java
│   │   └── com.icoderoad.largefile
│   │       ├── config
│   │       │   └── FileUploadProperties.java   // 读取配置文件的类
│   │       ├── controller
│   │       │   └── FileUploadController.java   // 文件上传控制器
│   │       ├── service
│   │       │   └── FileProcessingService.java  // 文件处理服务(含分块处理逻辑)
│   ├── resources
│   │   ├── application.yml                      // 配置文件
│   │   ├── templates
│   │   │   └── index.html                      // 文件上传页面
└─── └───pom.xml                                  // 项目依赖配置

POM 文件配置

在 pom.xml 中引入必要的依赖,包括 Spring Boot、Thymeleaf、文件上传和 JSON 处理等。

<?xml versinotallow="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
	<modelVersion>4.0.0</modelVersion>
	<parent>
		<groupId>org.springframework.boot</groupId>
		<artifactId>spring-boot-starter-parent</artifactId>
		<version>3.3.3</version>
		<relativePath/> <!-- lookup parent from repository -->
	</parent>
	<groupId>com.icoderoad</groupId>
	<artifactId>largefile-upload</artifactId>
	<version>0.0.1-SNAPSHOT</version>
	<name>largefile-upload</name>
	<description>Demo project for Spring Boot</description>
	
	<properties>
		<java.version>17</java.version>
	</properties>
	<dependencies>
		<!-- Spring Boot Starter Web -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <!-- Thymeleaf 模板引擎 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

        <!-- 文件上传相关依赖 -->
        <dependency>
            <groupId>commons-fileupload</groupId>
            <artifactId>commons-fileupload</artifactId>
            <version>1.4</version>
        </dependency>

        <!-- lombok -->
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <scope>provided</scope>
        </dependency>

		<dependency>
			<groupId>org.springframework.boot</groupId>
			<artifactId>spring-boot-starter-test</artifactId>
			<scope>test</scope>
		</dependency>
	</dependencies>

	<build>
		<plugins>
			<plugin>
				<groupId>org.springframework.boot</groupId>
				<artifactId>spring-boot-maven-plugin</artifactId>
			</plugin>
		</plugins>
	</build>

</project>

YAML 配置文件 application.yml

在 application.yml 中配置文件上传相关属性。

server:
  port: 8080

spring:
  servlet:
    multipart:
      max-file-size: 200MB
      max-request-size: 210MB

file-upload:
  upload-dir: /tmp/uploads
  chunk-size: 1MB # 分块大小

读取配置类 FileUploadProperties.java

package com.icoderoad.largefile.config;

import lombok.Data;
import org.springframework.boot.context.properties.ConfigurationProperties;
import org.springframework.stereotype.Component;

@Data
@Component
@ConfigurationProperties(prefix = "file-upload")
public class FileUploadProperties {
    private String uploadDir;
    private String chunkSize; // 分块大小
}

文件处理服务 FileProcessingService.java

在服务层中实现分块处理的逻辑,包括接收文件块并按顺序保存。

package com.example.largefile.service;

import com.example.largefile.config.FileUploadProperties;
import lombok.RequiredArgsConstructor;
import org.springframework.stereotype.Service;
import org.springframework.web.multipart.MultipartFile;

import java.io.*;
import java.nio.file.Files;
import java.nio.file.Path;
import java.nio.file.Paths;
import java.util.Objects;

@Service
@RequiredArgsConstructor
public class FileProcessingService {

    private final FileUploadProperties fileUploadProperties;

    // 保存单个文件块
    public void saveFileChunk(MultipartFile file, String filename, int chunkIndex) throws Exception {
        // 获取上传目录
        String uploadDir = fileUploadProperties.getUploadDir();
        Path uploadPath = Paths.get(uploadDir);

        if (!Files.exists(uploadPath)) {
            Files.createDirectories(uploadPath);
        }

        // 保存文件块到临时文件
        File outputFile = new File(uploadDir + File.separator + filename + ".part" + chunkIndex);
        try (InputStream inputStream = file.getInputStream();
             FileOutputStream outputStream = new FileOutputStream(outputFile)) {
            byte[] buffer = new byte[1024 * 1024]; // 1MB 缓冲区
            int bytesRead;
            while ((bytesRead = inputStream.read(buffer)) != -1) {
                outputStream.write(buffer, 0, bytesRead);
            }
        }
    }

    // 合并文件块
    public void mergeFileChunks(String filename, int totalChunks) throws Exception {
        String uploadDir = fileUploadProperties.getUploadDir();
        File outputFile = new File(uploadDir + File.separator + filename);
        try (FileOutputStream outputStream = new FileOutputStream(outputFile, true)) {
            for (int i = 0; i < totalChunks; i++) {
                File chunkFile = new File(uploadDir + File.separator + filename + ".part" + i);
                try (FileInputStream inputStream = new FileInputStream(chunkFile)) {
                    byte[] buffer = new byte[1024 * 1024];
                    int bytesRead;
                    while ((bytesRead = inputStream.read(buffer)) != -1) {
                        outputStream.write(buffer, 0, bytesRead);
                    }
                }
                // 删除块文件
                chunkFile.delete();
            }
        }
    }
}

文件上传控制器 FileUploadController.java

控制器接收分块文件,并在所有块接收完成后调用服务合并文件。返回 JSON 格式的数据,提示前端上传进度和状态。

package com.icoderoad.largefile.controller;

import java.util.HashMap;
import java.util.Map;

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.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;

import com.icoderoad.largefile.service.FileProcessingService;

import lombok.RequiredArgsConstructor;

@RestController
@RequiredArgsConstructor
@RequestMapping("/upload")
public class FileUploadController {

    private final FileProcessingService fileProcessingService;

    @PostMapping("/chunk")
    public Map<String, Object> handleFileChunkUpload(
            @RequestParam("file") MultipartFile file,
            @RequestParam("filename") String filename,
            @RequestParam("chunkIndex") int chunkIndex,
            @RequestParam("totalChunks") int totalChunks) {
        
        Map<String, Object> response = new HashMap<>();
        try {
            fileProcessingService.saveFileChunk(file, filename, chunkIndex);
            response.put("status", "chunk_uploaded");
            response.put("chunkIndex", chunkIndex);

            // 如果是最后一个块,进行文件合并
            if (chunkIndex == totalChunks - 1) {
                fileProcessingService.mergeFileChunks(filename, totalChunks);
                response.put("status", "file_uploaded");
            }
        } catch (Exception e) {
            response.put("status", "error");
            response.put("message", e.getMessage());
        }
        return response;
    }
}

前端页面 index.html

前端页面使用 jQuery 分块上传文件,并使用 Bootstrap 的提示组件显示上传进度和结果。

在 src/main/resources/templates 目录下创建 index.html 文件:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>大文件上传</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>

<div class="container">
    <h2 class="mt-5">大文件上传</h2>

    <form id="uploadForm">
        <div class="form-group">
            <label for="file">选择文件</label>
            <input type="file" class="form-control-file" id="file" name="file">
        </div>
        <button type="button" id="uploadBtn" class="btn btn-primary">上传</button>
    </form>

    <div id="uploadProgress" class="alert alert-info mt-3" style="display:none;"></div>
</div>

<script>
    $(function() {
        $('#uploadBtn').on('click', function() {
            var file = $('#file')[0].files[0];
            if (!file) {
                alert('请选择文件进行上传');
                return;
            }

            var chunkSize = 1024 * 1024; // 1MB
            var totalChunks = Math.ceil(file.size / chunkSize);

            for (var i = 0; i < totalChunks; i++) {
                var chunk = file.slice(i * chunkSize, (i + 1) * chunkSize);
                var formData = new FormData();
                formData.append('file', chunk);
                formData.append('filename', file.name);
                formData.append('chunkIndex', i);
                formData.append('totalChunks', totalChunks);

                $.ajax({
                    url: '/upload/chunk',
                    type: 'POST',
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function (response) {
                        if (response.status === 'chunk_uploaded') {
                            $('#uploadProgress').show().text('已上传块: ' + (response.chunkIndex + 1) + '/' + totalChunks);
                        } else if (response.status === 'file_uploaded') {
                            $('#uploadProgress').removeClass('alert-info').addClass('alert-success').text('文件上传完成');
                        }
                    }
                });
            }
        });
    });
</script>

</body>
</html>

总结

本文深入探讨了如何在 Spring Boot3.3 中实现大文件分块处理与上传,通过分块的方式降低内存压力,并且结合 jQuery 前端实现了分块提交,利用 Bootstrap 进行用户上传状态的提示。通过这种方式,既提高了系统的稳定性,也增强了用户体验。在实际应用中,这种技术可以广泛应用于音视频文件上传、日志文件处理等场景,确保系统在处理大数据时依然能高效、稳定地运行。

责任编辑:武晓燕 来源: 路条编程
相关推荐

2024-08-26 09:15:55

RedissonMyBatisSpring

2010-04-23 14:04:23

Oracle日期操作

2024-05-07 09:01:21

Queue 模块Python线程安全队列

2013-06-08 11:13:00

Android开发XML解析

2013-04-15 10:48:16

Xcode ARC详解iOS ARC使用

2010-09-08 17:46:13

2021-04-23 20:59:02

ThreadLocal内存

2009-07-04 11:05:48

Linux安全攻略

2009-02-20 11:43:22

UNIXfish全攻略

2014-03-19 17:22:33

2009-12-14 14:32:38

动态路由配置

2009-10-19 15:20:01

家庭综合布线

2022-07-25 11:33:48

Python大文件

2020-12-28 10:50:09

Linux环境变量命令

2009-07-04 11:26:12

unix应急安全攻略

2022-10-21 11:30:42

用户生命周期分析

2009-10-12 15:06:59

2015-03-04 13:53:33

MySQL数据库优化SQL优化

2010-10-11 13:54:03

Windows Ser

2020-11-23 15:21:12

Linux环境变量
点赞
收藏

51CTO技术栈公众号