java springboot 切割分片上传大文件

朴灿烈づ我的快乐病毒、 2021-11-14 11:38 683阅读 0赞

公司要做一个上传文件的功能，浏览器上传超过500m的文件会崩溃

需要切割分片上传

前端用的百度的 webuploader插件

官网 [http://c7.gg/cdpA6][http_c7.gg_cdpA6]

用的springboot

打开后页面为这样

上传文件，我上传的事一个338m的文件，切割为每个32m的文件

上传后，切割为11份，

上传成功后，合并11文件为一个文件，并将11个文件删除

源码地址：

csdn https://download.csdn.net/download/qq\_34874784/10743990

码云：https://gitee.com/c1henye/springboot-study

项目结构为

jar 只新增了commons-fileupload这一个jar

pom.xml

<?xml version="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 http://maven.apache.org/xsd/maven-4.0.0.xsd">  
    <modelVersion>4.0.0</modelVersion>  
   
    <groupId>com.example</groupId>  
    <artifactId>springboot-bigfile</artifactId>  
    <version>0.0.1-SNAPSHOT</version>  
    <packaging>jar</packaging>  
   
    <name>springboot-bigfile</name>  
    <description>Demo project for Spring Boot</description>  
   
    <parent>  
        <groupId>org.springframework.boot</groupId>  
        <artifactId>spring-boot-starter-parent</artifactId>  
        <version>2.0.6.RELEASE</version>  
        <relativePath/>   
    </parent>  
   
    <properties>  
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>  
        <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>  
        <java.version>1.8</java.version>  
    </properties>  
    <repositories>  
        <repository>  
            <id>maven-ali</id>  
            <url>http://maven.aliyun.com/nexus/content/groups/public/</url>  
        </repository>  
    </repositories>  
    <dependencies>  
        <dependency>  
            <groupId>org.springframework.boot</groupId>  
            <artifactId>spring-boot-starter-web</artifactId>  
        </dependency>  
   
        <dependency>  
            <groupId>org.springframework.boot</groupId>  
            <artifactId>spring-boot-devtools</artifactId>  
            <scope>runtime</scope>  
        </dependency>  
        <dependency>  
            <groupId>org.springframework.boot</groupId>  
            <artifactId>spring-boot-starter-test</artifactId>  
            <scope>test</scope>  
        </dependency>  
        <dependency>  
            <groupId>commons-fileupload</groupId>  
            <artifactId>commons-fileupload</artifactId>  
            <version>1.3.3</version>  
        </dependency>  
    </dependencies>  
   
    <build>  
        <plugins>  
            <plugin>  
                <groupId>org.springframework.boot</groupId>  
                <artifactId>spring-boot-maven-plugin</artifactId>  
            </plugin>  
        </plugins>  
    </build>  
   
   
</project>  
springboot, 默认限制了上传文件最大为1m,需修改，我修改为了50m

FileConfig

package com.example.springbootbigfile;  
   
import org.springframework.beans.factory.annotation.Value;  
import org.springframework.boot.web.servlet.MultipartConfigFactory;  
import org.springframework.context.annotation.Bean;  
import org.springframework.context.annotation.Configuration;  
   
import javax.servlet.MultipartConfigElement;  
   
@Configuration  
public class FileConfig \{  
   
   /\*\*  
    \* 文件上传配置  
    \*   
    \* @return MultipartConfigElement  
    \*/  
   @Bean  
   public MultipartConfigElement multipartConfigElement(  
         @Value("$\{multipart.maxFileSize\}") String maxFileSize,  
         @Value("$\{multipart.maxRequestSize\}") String maxRequestSize) \{  
      MultipartConfigFactory factory = new MultipartConfigFactory();  
      // 单个文件最大  
      factory.setMaxFileSize(maxFileSize);  
      // 设置总上传数据总大小  
      factory.setMaxRequestSize(maxRequestSize);  
      return factory.createMultipartConfig();  
   \}  
   
\}  
   
application.properties

\#文件上传路径  
uploadFolder=D:/data/appfiles/  
   
\#单个文件最大  
multipart.maxFileSize=3000MB  
\#设置总上传数据总大小  
multipart.maxRequestSize=10000MB  
   
server.port=8088  
JsonResult  
package com.example.springbootbigfile;  
   
/\*\*  
 \* 描述: json格式数据返回对象，使用CustomJsonResultSerializer 来序列化  
 \* @author : lijiazhi  
 \*/  
public class JsonResult<T> \{  
    
    private String code;  
    private String msg;  
    private T data;  
   
    public String getCode() \{  
        return code;  
    \}  
    public void setCode(String code) \{  
        this.code = code;  
    \}  
    public String getMsg() \{  
        return msg;  
    \}  
    public void setMsg(String msg) \{  
        this.msg = msg;  
    \}  
    public T getData() \{  
        return data;  
    \}  
    public void setData(T data) \{  
        this.data = data;  
    \}  
   
    @Override  
    public String toString() \{  
        return "code=" + code + " message=" + msg + " data=" + data;  
    \}  
   
    public static <T> JsonResult<T> fail() \{  
       JsonResult<T> ret = new JsonResult<T>();  
       ret.setCode("201");  
       ret.setMsg("失败");  
        return ret;  
    \}  
      
    public static <T>  JsonResult<T> fail(T data) \{  
          JsonResult<T> ret = JsonResult.fail();  
          ret.setData(data);  
        return ret;  
    \}  
      
    public static <T>  JsonResult<T> failMessage(String msg) \{  
          JsonResult<T> ret = JsonResult.fail();  
          ret.setMsg(msg);  
        return ret;  
    \}  
    public static <T>  JsonResult<T> successMessage(String msg) \{  
          JsonResult<T> ret = JsonResult.success();  
          ret.setMsg(msg);  
       return ret;  
    \}  
   
    public static <T> JsonResult<T> success() \{  
       JsonResult<T> ret = new JsonResult<T>();  
       ret.setCode("200");  
       ret.setMsg("");  
        return ret;  
    \}  
   
    public static <T> JsonResult<T> success(T data) \{  
          JsonResult<T> ret = JsonResult.success();  
          ret.setData(data);  
        return ret;  
    \}  
      
    public static <T> JsonResult<T>  http404(T data) \{  
          JsonResult<T> ret = new JsonResult<T>();  
          ret.setCode("404");  
          ret.setMsg("");  
          ret.setData(data);  
        return ret;  
    \}  
      
    public static <T> JsonResult<T> http403(T data) \{  
          JsonResult<T> ret = new JsonResult<T>();  
          ret.setCode("403");  
          ret.setMsg("");  
          ret.setData(data);  
        return ret;  
    \}  
   
\}  
UploadController

package com.example.springbootbigfile;  
   
import java.io.\*;  
   
import javax.servlet.http.HttpServletRequest;  
import javax.servlet.http.HttpServletResponse;  
   
import org.apache.commons.fileupload.servlet.ServletFileUpload;  
import org.apache.commons.io.FileUtils;  
import org.springframework.beans.factory.annotation.Value;  
import org.springframework.stereotype.Controller;  
import org.springframework.web.bind.annotation.RequestMapping;  
import org.springframework.web.bind.annotation.ResponseBody;  
import org.springframework.web.multipart.MultipartFile;  
   
   
@Controller  
public class UploadController\{  
     
   @Value("$\{uploadFolder\}")  
   private String filePath;  
   
   private  final String MODEL="upload";  
   /\*\*  
    \* 上传文件  
    \* @param request  
    \* @param response  
    \* @param guid  
    \* @param chunk  
    \* @param file  
    \* @param chunks  
    \*/  
   @RequestMapping( MODEL+ "/upload")  
   public void bigFile(HttpServletRequest request, HttpServletResponse response,String guid,Integer chunk, MultipartFile file,Integer chunks)\{  
      try \{    
            boolean isMultipart = ServletFileUpload.isMultipartContent(request);    
            if (isMultipart) \{    
                // 临时目录用来存放所有分片文件    
                String tempFileDir = filePath + guid;    
                File parentFileDir = new File(tempFileDir);    
                if (!parentFileDir.exists()) \{    
                    parentFileDir.mkdirs();    
                \}    
                // 分片处理时，前台会多次调用上传接口，每次都会上传文件的一部分到后台    
                File tempPartFile = new File(parentFileDir, guid + "\_" + chunk + ".part");    
                FileUtils.copyInputStreamToFile(file.getInputStream(), tempPartFile);    
            \}    
        \} catch (Exception e) \{    
           e.printStackTrace();  
        \}    
   \}  
     
   /\*\*  
    \* 合并文件  
    \* @param guid  
    \* @param fileName  
    \* @throws Exception  
    \*/  
   @RequestMapping( MODEL+"/merge")  
   @ResponseBody  
   public JsonResult mergeFile(String guid,String fileName)\{  
       // 得到 destTempFile 就是最终的文件    
      try \{  
         File parentFileDir = new File(filePath + guid);  
         if(parentFileDir.isDirectory())\{  
            File destTempFile = new File(filePath + "/merge", fileName);  
            if(!destTempFile.exists())\{  
               //先得到文件的上级目录，并创建上级目录，在创建文件,  
               destTempFile.getParentFile().mkdir();  
               try \{  
                  //创建文件  
                  destTempFile.createNewFile(); //上级目录没有创建，这里会报错  
               \} catch (IOException e) \{  
                  e.printStackTrace();  
               \}  
            \}  
            System.out.println(parentFileDir.listFiles().length);  
              for (int i = 0; i < parentFileDir.listFiles().length; i++) \{    
                  File partFile = new File(parentFileDir, guid + "\_" + i + ".part");  
                  FileOutputStream destTempfos = new FileOutputStream(destTempFile, true);  
                  //遍历"所有分片文件"到"最终文件"中    
                  FileUtils.copyFile(partFile, destTempfos);    
                  destTempfos.close();    
              \}    
              // 删除临时目录中的分片文件    
              FileUtils.deleteDirectory(parentFileDir);  
              return JsonResult.success();  
         \}  
      \} catch (Exception e) \{  
         e.printStackTrace();  
         return JsonResult.fail();  
      \}  
      return null;  
   \}  
\}

html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
   <link href="https://cdn.staticfile.org/webuploader/0.1.5/webuploader.css" rel="stylesheet" type="text/css" />  
   <script type="text/javascript" src="http://cdn.staticfile.org/jquery/1.10.2/jquery.js"></script>  
   <script type="text/javascript" src="http://cdn.staticfile.org/webuploader/0.1.5/webuploader.min.js"></script>  
</head>  
<body>  
   <div id="uploader" class="wu-example">  
        
      <div id="thelist" class="uploader-list"></div>  
      <div class="btns">  
         <div id="picker">选择文件</div>  
         <button id="ctlBtn" class="btn btn-default">开始上传</button>  
      </div>  
   </div>  
</body>  
<script type="text/javascript">  
var GUID = WebUploader.Base.guid();//一个GUID  
var uploader = WebUploader.create(\{  
    // swf文件路径  
    swf: 'http://cdn.staticfile.org/webuploader/0.1.5/Uploader.swf',  
    // 文件接收服务端。  
    server: './upload/upload',  
    formData:\{  
       guid : GUID  
    \},  
    // 选择文件的按钮。可选。  
    // 内部根据当前运行是创建，可能是input元素，也可能是flash.  
    pick: '\#picker',  
   chunked : true, // 分片处理  
   chunkSize : 32 \* 1024 \* 1024, // 每片32M,  
   chunkRetry : false,// 如果失败，则不重试  
   threads : 1,// 上传并发数。允许同时最大上传进程数。  
    // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！  
    resize: false  
\});  
$("\#ctlBtn").click(function () \{  
   uploader.upload();  
\});  
//当文件上传成功时触发。  
uploader.on( "uploadSuccess", function( file ) \{  
    $.post('./upload/merge', \{ guid: GUID, fileName: file.name \}, function (data) \{  
       if(data.code == 200)\{  
          alert('上传成功!');  
       \}  
     \});  
\});  
</script>  
</html>

[http_c7.gg_cdpA6]: http://c7.gg/cdpA6