文件上传下载系列——大文件分片上传

// 设置每个分片的大小（字节）
const CHUNK_SIZE = 1 * 1024 * 1024; // 1MB
// 获取文件的MD5码
function getMD5(file) {
  // 在这里实现获取文件的MD5码的逻辑
  // 返回文件的MD5码
  // 可以使用第三方库或自己实现MD5算法来计算文件的MD5码
}
// 分片上传文件
function uploadFile(file) {
  const totalChunks = Math.ceil(file.size / CHUNK_SIZE);
  let currentChunk = 0;
  // 递归上传分片
  function uploadChunk() {
    const start = currentChunk * CHUNK_SIZE;
    const end = Math.min(start + CHUNK_SIZE, file.size);
    const chunk = file.slice(start, end);
    const formData = new FormData();
    formData.append('file', chunk);//文件块
    formData.append('chunkIndex', currentChunk); //当前块号
    formData.append('totalChunks', totalChunks); //总块数
    formData.append('chunkMD5', getMD5(chunk)); //当前块的MD5
    formData.append('fileName', file.name); //文件名
    // 使用axios发送分片数据到服务器
    axios.post('/upload', formData)
      .then(response => {
        // 分片上传成功
        currentChunk++;
        if (currentChunk < totalChunks) {
          // 继续上传下一个分片
          uploadChunk();
        } else {
          // 所有分片上传完成
          console.log('文件上传完成');
        }
      })
      .catch(error => {
        // 分片上传失败
        console.error('分片上传失败:', error);
      });
  }
  // 开始上传第一个分片
  uploadChunk();
}
// 选择文件并触发上传
const fileInput = document.getElementById('file-input');
fileInput.addEventListener('change', (event) => {
  const file = event.target.files[0];
  if (file) {
    uploadFile(file);
  }
});

@Controller
public class UploadController {
    private final static String utf8 ="utf-8";
    @RequestMapping("/upload")
    @ResponseBody
    public void upload(HttpServletRequest request, HttpServletResponse response) throws Exception {
        //分片
        response.setCharacterEncoding(utf8);//向浏览器输出 统一用该编码输出
        Integer schunk = null;//当前是哪个分片
        Integer schunks = null;//总分片数
        String name = null;//文件名
        String uploadPath = "E:\\ceshi";//文件临时存储目录，存储文件片
        BufferedOutputStream os = null;//文件合并时用的流
        try{
            DiskFileItemFactory factory = new DiskFileItemFactory();//设计文件上传参数
            factory.setSizeThreshold(1024);//缓冲区大小1024字节（文件先读到内存中，在往硬盘里写，中间需要缓存区）
            factory.setRepository(new File(uploadPath));//设置临时目录
            ServletFileUpload upload = new ServletFileUpload(factory);//upload帮助解析request
            upload.setFileSizeMax(5l *1024l *1024l*1024l);//设置参数，多文件上传，限制限制单个文件大小最大为5G
            upload.setSizeMax(10l *1024l *1024l*1024l);//限制所有文件最大为10G
            List<FileItem> items = upload.parseRequest(request);
            //解析文件
            for(FileItem item : items){
                //判断是否是文件对象
                if(item.isFormField()){
                    //取出分片信息
                    if("chunkIndex".equals(item.getFieldName())){
                        schunk = Integer.parseInt(item.getString(utf8));//当前是哪个分片
                    }
                    if("totalChunks".equals(item.getFieldName())){
                        schunks = Integer.parseInt(item.getString(utf8));//总分片数
                    }
                    if("chunkMD5".equals(item.getFieldName())){
                        fileMD5 = item.getString(utf8);//文件块MD5
                    }
                    if("fileName".equals(item.getFieldName())){
                        name = item.getString(utf8);//文件名
                    }
                }
            }
            for(FileItem item : items){
                if(!item.isFormField()){
                    String temFileName = name;//临时目录
                    if(name != null){
                        if(schunk != null){
                            temFileName = schunk +"_"+name;//生成临时文件
                        }
                        File temFile = new File(uploadPath,temFileName);
                        //给临时文件生成MD5，和前端传来的MD5比较的代码略
                        //如果文件不存在就上传
                        if(!temFile.exists()){
                            item.write(temFile);
                        }
                    }
                }
            }
            //文件合并，判断是不是传到最后一个分片了
            if(schunk != null && schunk.intValue() == schunks.intValue()-1){
                File tempFile = new File(uploadPath,name);//准备临时文件把分片写入文件
                os = new BufferedOutputStream(new FileOutputStream(tempFile));//向流中写入文件信息
                //找到所有分片
                //判断所有分片是都存在
                for(int i=0 ;i<schunks;i++){
                    File file = new File(uploadPath,i+"_"+name);
                    //如果有分片不存在，先休眠，直到所有分片都存在
                    while(!file.exists()){
                        Thread.sleep(100);
                    }
                    //读取分片
                    byte[] bytes = FileUtils.readFileToByteArray(file);
                    os.write(bytes);//写入到流中
                    os.flush();//
                    file.delete();//删除临时文件
                }
                os.flush();
            }
            response.getWriter().write("上传成功"+name);
        }finally {
            try{
                if(os != null){
                    os.close();//关文件流
                }
            }catch (IOException e){
                e.printStackTrace();
            }
        }
    }
}