前言

文件上传是一个老生常谈的话题了,在文件相对比较小的情况下,可以直接把文件转化为字节流上传到服务器,但在文件比较大的情况下,用普通的方式进行上传,这可不是一个好的办法,毕竟很少有人会忍受,当文件上传到一半中断后,继续上传却只能重头开始上传,这种让人不爽的体验。那有没有比较好的上传体验呢,答案有的,就是下边要介绍的几种上传方式

详细教程

秒传

1、什么是秒传
通俗的说,你把要上传的东西上传,服务器会先做MD5校验,如果服务器上有一样的东西,它就直接给你个新地址,其实你下载的都是服务器上的同一个文件,想要不秒传,其实只要让MD5改变,就是对文件本身做一下修改(改名字不行),例如一个文本文件,你多加几个字,MD5就变了,就不会秒传了.

2、本文实现的秒传核心逻辑

  • a、利用redis的set方法存放文件上传状态,其中key为文件上传的md5,value为是否上传完成的标志位,

  • b、当标志位true为上传已经完成,此时如果有相同文件上传,则进入秒传逻辑。如果标志位为false,则说明还没上传完成,此时需要在调用set的方法,保存块号文件记录的路径,其中key为上传文件md5加一个固定前缀,value为块号文件记录路径

分片上传

1.什么是分片上传
分片上传,就是将所要上传的文件,按照一定的大小,将整个文件分隔成多个数据块(我们称之为Part)来进行分别上传,上传完之后再由服务端对所有上传的文件进行汇总整合成原始的文件。

2.分片上传的场景

  • 1.大文件上传

  • 2.网络环境环境不好,存在需要重传风险的场景

断点续传

1、什么是断点续传
断点续传是在下载或上传时,将下载或上传任务(一个文件或一个压缩包)人为的划分为几个部分,每一个部分采用一个线程进行上传或下载,如果碰到网络故障,可以从已经上传或下载的部分开始继续上传或者下载未完成的部分,而没有必要从头开始上传或者下载。本文的断点续传主要是针对断点上传场景。

2、应用场景
断点续传可以看成是分片上传的一个衍生,因此可以使用分片上传的场景,都可以使用断点续传。

3、实现断点续传的核心逻辑
在分片上传的过程中,如果因为系统崩溃或者网络中断等异常因素导致上传中断,这时候客户端需要记录上传的进度。在之后支持再次上传时,可以继续从上次上传中断的地方进行继续上传。

为了避免客户端在上传之后的进度数据被删除而导致重新开始从头上传的问题,服务端也可以提供相应的接口便于客户端对已经上传的分片数据进行查询,从而使客户端知道已经上传的分片数据,从而从下一个分片数据开始继续上传。

4、实现流程步骤

  • a、方案一,常规步骤
    将需要上传的文件按照一定的分割规则,分割成相同大小的数据块;
    初始化一个分片上传任务,返回本次分片上传唯一标识;
    按照一定的策略(串行或并行)发送各个分片数据块;
    发送完成后,服务端根据判断数据上传是否完整,如果完整,则进行数据块合成得到原始文件。

  • b、方案二、本文实现的步骤
    前端(客户端)需要根据固定大小对文件进行分片,请求后端(服务端)时要带上分片序号和大小
    服务端创建conf文件用来记录分块位置,conf文件长度为总分片数,每上传一个分块即向conf文件中写入一个127,那么没上传的位置就是默认的0,已上传的就是Byte.MAX_VALUE 127(这步是实现断点续传和秒传的核心步骤)
    服务器按照请求数据中给的分片序号和每片分块大小(分片大小是固定且一样的)算出开始位置,与读取到的文件片段数据,写入文件。

5、分片上传/断点上传代码实现

  • a、前端采用百度提供的webuploader的插件,进行分片。因本文主要介绍服务端代码实现

  • b、后端用两种方式实现文件写入,一种是用RandomAccessFile

    示例下载地址:

  • asp.net:https://gitee.com/xproer/asp-net/tree/6.5.38/

  • jsp-eclipse:https://gitee.com/xproer/jsp-eclipse/tree/6.5.38/

  • jsp-myeclipse:https://gitee.com/xproer/jsp-myeclipse/tree/6.5.38/

  • jsp-springboot:https://gitee.com/xproer/jsp-springboot/tree/6.5.38/

  • php:https://gitee.com/xproer/php/tree/6.5.38/

  • vue-cli:https://gitee.com/xproer/vue-cli

后端进行写入操作的核心代码

  • a、RandomAccessFile实现方式

@UploadMode(mode = UploadModeEnum.RANDOM_ACCESS)  @Slf4j  public class RandomAccessUploadStrategy extends SliceUploadTemplate {  @Autowired  private FilePathUtil filePathUtil;  @Value("${upload.chunkSize}")  private long defaultChunkSize;  @Override  public boolean upload(FileUploadRequestDTO param) {  RandomAccessFile accessTmpFile = null;  try {  String uploadDirPath = filePathUtil.getPath(param);  File tmpFile = super.createTmpFile(param);  accessTmpFile = new RandomAccessFile(tmpFile, "rw");  //这个必须与前端设定的值一致  long chunkSize = Objects.isNull(param.getChunkSize()) ? defaultChunkSize * 1024 * 1024  : param.getChunkSize();  long offset = chunkSize * param.getChunk();  //定位到该分片的偏移量  accessTmpFile.seek(offset);  //写入该分片数据  accessTmpFile.write(param.getFile().getBytes());  boolean isOk = super.checkAndSetUploadProgress(param, uploadDirPath);  return isOk;  } catch (IOException e) {  log.error(e.getMessage(), e);  } finally {  FileUtil.close(accessTmpFile);  }  return false;  }  }
  • b、MappedByteBuffer实现方式

@UploadMode(mode = UploadModeEnum.MAPPED_BYTEBUFFER)  @Slf4j  public class MappedByteBufferUploadStrategy extends SliceUploadTemplate {  @Autowired  private FilePathUtil filePathUtil;  @Value("${upload.chunkSize}")  private long defaultChunkSize;  @Override  public boolean upload(FileUploadRequestDTO param) {  RandomAccessFile tempRaf = null;  FileChannel fileChannel = null;  MappedByteBuffer mappedByteBuffer = null;  try {  String uploadDirPath = filePathUtil.getPath(param);  File tmpFile = super.createTmpFile(param);  tempRaf = new RandomAccessFile(tmpFile, "rw");  fileChannel = tempRaf.getChannel();  long chunkSize = Objects.isNull(param.getChunkSize()) ? defaultChunkSize * 1024 * 1024  : param.getChunkSize();  //写入该分片数据  long offset = chunkSize * param.getChunk();  byte[] fileData = param.getFile().getBytes();  mappedByteBuffer = fileChannel
.map(FileChannel.MapMode.READ_WRITE, offset, fileData.length);  mappedByteBuffer.put(fileData);  boolean isOk = super.checkAndSetUploadProgress(param, uploadDirPath);  return isOk;  } catch (IOException e) {  log.error(e.getMessage(), e);  } finally {  FileUtil.freedMappedByteBuffer(mappedByteBuffer);  FileUtil.close(fileChannel);  FileUtil.close(tempRaf);  }  return false;  }  }
  • c、文件操作核心模板类代码

@Slf4j  public abstract class SliceUploadTemplate implements SliceUploadStrategy {  public abstract boolean upload(FileUploadRequestDTO param);  protected File createTmpFile(FileUploadRequestDTO param) {  FilePathUtil filePathUtil = SpringContextHolder.getBean(FilePathUtil.class);  param.setPath(FileUtil.withoutHeadAndTailDiagonal(param.getPath()));  String fileName = param.getFile().getOriginalFilename();  String uploadDirPath = filePathUtil.getPath(param);  String tempFileName = fileName + "_tmp";  File tmpDir = new File(uploadDirPath);  File tmpFile = new File(uploadDirPath, tempFileName);  if (!tmpDir.exists()) {  tmpDir.mkdirs();  }  return tmpFile;  }  @Override  public FileUploadDTO sliceUpload(FileUploadRequestDTO param) {  boolean isOk = this.upload(param);  if (isOk) {  File tmpFile = this.createTmpFile(param);  FileUploadDTO fileUploadDTO = this.saveAndFileUploadDTO(param.getFile().getOriginalFilename(), tmpFile);  return fileUploadDTO;  }  String md5 = FileMD5Util.getFileMD5(param.getFile());  Map<Integer, String> map = new HashMap<>();  map.put(param.getChunk(), md5);  return FileUploadDTO.builder().chunkMd5Info(map).build();  }  /**  * 检查并修改文件上传进度  */  public boolean checkAndSetUploadProgress(FileUploadRequestDTO param, String uploadDirPath) {  String fileName = param.getFile().getOriginalFilename();  File confFile = new File(uploadDirPath, fileName + ".conf");  byte isComplete = 0;  RandomAccessFile accessConfFile = null;  try {  accessConfFile = new RandomAccessFile(confFile, "rw");  //把该分段标记为 true 表示完成  System.out.println("set part " + param.getChunk() + " complete");  //创建conf文件文件长度为总分片数,每上传一个分块即向conf文件中写入一个127,那么没上传的位置就是默认0,已上传的就是Byte.MAX_VALUE 127  accessConfFile.setLength(param.getChunks());  accessConfFile.seek(param.getChunk());  accessConfFile.write(Byte.MAX_VALUE);  //completeList 检查是否全部完成,如果数组里是否全部都是127(全部分片都成功上传)  byte[] completeList = FileUtils.readFileToByteArray(confFile);  isComplete = Byte.MAX_VALUE;  for (int i = 0; i < completeList.length && isComplete == Byte.MAX_VALUE; i++) {  //与运算, 如果有部分没有完成则 isComplete 不是 Byte.MAX_VALUE  isComplete = (byte) (isComplete & completeList[i]);  System.out.println("check part " + i + " complete?:" + completeList[i]);  }  } catch (IOException e) {  log.error(e.getMessage(), e);  } finally {  FileUtil.close(accessConfFile);  }  boolean isOk = setUploadProgress2Redis(param, uploadDirPath, fileName, confFile, isComplete);  return isOk;  }  /**  * 把上传进度信息存进redis  */  private boolean setUploadProgress2Redis(FileUploadRequestDTO param, String uploadDirPath,  String fileName, File confFile, byte isComplete) {  RedisUtil redisUtil = SpringContextHolder.getBean(RedisUtil.class);  if (isComplete == Byte.MAX_VALUE) {  redisUtil.hset(FileConstant.FILE_UPLOAD_STATUS, param.getMd5(), "true");  redisUtil.del(FileConstant.FILE_MD5_KEY + param.getMd5());  confFile.delete();  return true;  } else {  if (!redisUtil.hHasKey(FileConstant.FILE_UPLOAD_STATUS, param.getMd5())) {  redisUtil.hset(FileConstant.FILE_UPLOAD_STATUS, param.getMd5(), "false");  redisUtil.set(FileConstant.FILE_MD5_KEY + param.getMd5(),  uploadDirPath + FileConstant.FILE_SEPARATORCHAR + fileName + ".conf");  }  return false;  }  }  /**  * 保存文件操作  */  public FileUploadDTO saveAndFileUploadDTO(String fileName, File tmpFile) {  FileUploadDTO fileUploadDTO = null;  try {  fileUploadDTO = renameFile(tmpFile, fileName);  if (fileUploadDTO.isUploadComplete()) {  System.out  .println("upload complete !!" + fileUploadDTO.isUploadComplete() + " name=" + fileName);  //TODO 保存文件信息到数据库  }  } catch (Exception e) {  log.error(e.getMessage(), e);  } finally {  }  return fileUploadDTO;  }  /**  * 文件重命名  *  * @param toBeRenamed 将要修改名字的文件  * @param toFileNewName 新的名字  */  private FileUploadDTO renameFile(File toBeRenamed, String toFileNewName) {  //检查要重命名的文件是否存在,是否是文件  FileUploadDTO fileUploadDTO = new FileUploadDTO();  if (!toBeRenamed.exists() || toBeRenamed.isDirectory()) {  log.info("File does not exist: {}", toBeRenamed.getName());  fileUploadDTO.setUploadComplete(false);  return fileUploadDTO;  }  String ext = FileUtil.getExtension(toFileNewName);  String p = toBeRenamed.getParent();  String filePath = p + FileConstant.FILE_SEPARATORCHAR + toFileNewName;  File newFile = new File(filePath);  //修改文件名  boolean uploadFlag = toBeRenamed.renameTo(newFile);  fileUploadDTO.setMtime(DateUtil.getCurrentTimeStamp());  fileUploadDTO.setUploadComplete(uploadFlag);  fileUploadDTO.setPath(filePath);  fileUploadDTO.setSize(newFile.length());  fileUploadDTO.setFileExt(ext);  fileUploadDTO.setFileId(toFileNewName);  return fileUploadDTO;  }  }

总结

在实现分片上传的过程,需要前端和后端配合,比如前后端的上传块号的文件大小,前后端必须得要一致,否则上传就会有问题。其次文件相关操作正常都是要搭建一个文件服务器的,比如使用fastdfs、hdfs等。

本示例代码在电脑配置为4核内存8G情况下,上传24G大小的文件,上传时间需要30多分钟,主要时间耗费在前端的md5值计算,后端写入的速度还是比较快。如果项目组觉得自建文件服务器太花费时间,且项目的需求仅仅只是上传下载,那么推荐使用阿里的oss服务器,其介绍可以查看官网:

https://help.aliyun.com/product/31815.html

阿里的oss它本质是一个对象存储服务器,而非文件服务器,因此如果有涉及到大量删除或者修改文件的需求,oss可能就不是一个好的选择。

效果展示:

这是文件块上传的效果

这是文件夹上传完后的效果

超大文件上传下载以及秒传、提速和限速方案完整(包含前后端)相关推荐

  1. Akka实战:HTTP大文件断点上传、下载,秒传

    2019独角兽企业重金招聘Python工程师标准>>> 访问:https://github.com/yangbajing/scala-applications/tree/master ...

  2. java上传大文件_Java超大文件上传解决办法

    这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数 下面直接贴代码吧,一些难懂的我大部分都加上注释了: 上传文件实体类: 看得 ...

  3. http超大文件上传方案

    需求:项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在500M内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以501M来进行限制. 第一步: 前端修改 由于项目使用的是 ...

  4. 求超大文件上传方案( js )

    文件夹上传:从前端到后端 文件上传是 Web 开发肯定会碰到的问题,而文件夹上传则更加难缠.网上关于文件夹上传的资料多集中在前端,缺少对于后端的关注,然后讲某个后端框架文件上传的文章又不会涉及文件夹. ...

  5. 分片上传,断点续传,还有秒传

    分片上传 为什么需要分片上传 如果文件体积比较大,或者网络条件不好时,上传的时间会比较长(要传输更多的报文,丢包重传的概率也更大),用户不能刷新页面,只能耐心等待请求完成. 分片上传的核心思想 利用H ...

  6. PHP超大文件上传与下载

    前段时间做视频上传业务,通过网页上传视频到服务器. 视频大小 小则几十M,大则 1G+,以一般的HTTP请求发送数据的方式的话,会遇到的问题:1,文件过大,超出服务端的请求大小限制:2,请求时间过长, ...

  7. ASP.NET超大文件上传与下载

    总结一下大文件分片上传和断点续传的问题.因为文件过大(比如1G以上),必须要考虑上传过程网络中断的情况.http的网络请求中本身就已经具备了分片上传功能,当传输的文件比较大时,http协议自动会将文件 ...

  8. JS 超大文件上传解决方案:分片断点上传(一)

    之前仿造uploadify写了一个HTML5版的文件上传插件,没看过的朋友可以点此先看一下~得到了不少朋友的好评,我自己也用在了项目中,不论是用户头像上传,还是各种媒体文件的上传,以及各种个性的业务需 ...

  9. 求超大文件上传方案( Web )

    需求: 项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在20G内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以20G来进行限制. PC端全平台支持,要求支持Window ...

最新文章

  1. 图像滤波 Image Filtering
  2. 设计需要冲击力:「不怕没品味的人,就怕没品味的人用心」
  3. python读取windows日志_Python解析windows系统日志文件
  4. 力压华为小米!安兔兔1月安卓性能榜第一名是它!
  5. API 网关的创建与管理:待续
  6. VM14 安装黑苹果教程步骤
  7. 聚合数据手机话费充值API,话费充值功能接入
  8. AAAI2020论文列表(中英对照)
  9. libtorch opecv c++ cmake clion
  10. Elasticsearch浅尝搜索
  11. 掌门教育三大举措落实个性化教学 让“因材施教”落到实处
  12. 抖音显示服务器升级要多久,抖音服务器升级要多久才能恢复正常
  13. QMessageBox 中的 OK 按钮改为中文“确定”
  14. clipboard剪贴板插件的使用教程
  15. ABB选项添加,ABB万能密钥
  16. 【键盘映射】AHK自定义Windows脚本
  17. 如何将谷歌地图高清卫星影像坐标系转换成西安80坐标(WGS84)
  18. marker 头像 高德地图_手机地图导航软件高德地图1.如何下载高德地图
  19. auto.js使用vscode连接手机教程
  20. RMD kint 不输出 include=TRUE,echo=TRUE

热门文章

  1. 【转载】CAD卸载重新安装方法,使用清理卸载工具完全彻底删除干净CAD各种残留注册表和文件。
  2. Python 类中的__call__()方法
  3. 用 canvas制作一个饼状图
  4. 一款真正实现“天涯若比邻”的远程软件
  5. Java集合相关学习——如何实现List集合的去重操作?
  6. 03_Shell 基础 - 环境变量配置文件
  7. unity点击按钮,切换Text内容
  8. Vue中修改Mint UI的Toast默认样式问题 - 字体大小调整
  9. 【软购商城】Splashtop Business Access 屏幕远程控制软件 1年订阅 仅需 398 主控端设备不限,授权随账户,被控端数量屈居于购买的数量。
  10. 微信小程序weui在线入门教程-WeUi表单组件-list列表