实现功能：

1. 上传文件

image.png

image.png

判断文件类型

背景：为防止用户重命名文件类型上传恶意文件，利用十六进制来校验文件真实类型。
步骤：
image.png
主要代码：

首先对文件转为十六进制，特定文件类型转换的十六进制有些特定值是不变的，可以根据特定值来判断文件是否属于这些类型。blob 对象转换十六进制字符代码如下：
image.png
比如“GIF” 的 “G” 转换为 ASCII 码为 71，再转为 16进制为 47，同理 “I” “F” 分别对应 49 46。
Gif 的十六进制前6个字符是固定的 ‘47 49 46 38 39 61’ 或者 ‘47 49 46 38 37 61’ 如果不等于，则文件不是Gif。

同理，PNG 用前8位判断，JPG 类型用前两位和后两位判断。
image.png

浏览器空闲时间

原理：利用浏览器空闲时间，来加速上传进度。
代码：
image.png

秒传

原理：对切片哈希缓存

断点续传

原理是对哈希后的切片进行判断，如果已有切片则不进行上传

并发控制

原理：维护一个任务队列，队列的长度不超过约定的并发数，执行一个任务pop一个任务，然后再追加一个新的任务。
通过并发数控制，可以扩展到网络控制： 由于TCP的慢启动特性，我们可以先上传一个初始区块，比如10kb，根据上传成功时间，决定下一个区块的大小。

错误捕获

对于上传过程中可能出现的错误，进行如下处理：

  • 报错之后，进度条变红，开始重试
  • 一个切片重试3次，仍然失败-整体终止

2. 新建文章

image.png