@mofiter/osc-file-uploader/readme.md

文件上传模块

## 文件上传模块
基于 [simple-uploader.js](https://github.com/simple-uploader/Uploader/blob/develop/README_zh-CN.md) 修改，以满足业务需求，支持秒传、分片上传、断点续传。

文件上传流程：
- 选择文件
- 计算文件唯一 id（xxhash 或 md5，默认是 xxhash）
- 发起进度检查的请求，查询文件是否已经上传，如果已经完整上传，则属于秒传的情况，直接返回文件 url；如果没有上传或者已经上传部分分片，则返回未上传的分片数组
- 针对每一个未上传的分片，发起上传请求
- 当所有分片上传完成后，发起合并请求，合并成功后，返回文件 url
- 在分片上传过程中，可以暂停上传。而继续开始上传时，会先再次发起进度检查的请求，查询剩余需要上传的分片（因为有可能其他地方已经上传了当前文件的部分分片），然后再发起上传请求

### 安装
```
npm install @mofiter/osc-file-uploader
```
### 使用
创建一个 Uploader 实例：
```
var uploader = new Uploader({})
```
指定 DOM 节点，点击选择文件：
```
uploader.assignBrowse(document.getElementById('upload-btn'))
```
指定 DOM 节点，拖拽选择文件：
```
uploader.assignDrop(document.getElementById('drop-target'))
```
监听文件上传过程中的事件：
```
// 添加单个文件，可以用于文件校验，如果返回 false，则不添加
uploader.on('fileAdded', function (file, event) {
    console.log('fileAdded', file, event)
})
// 添加多个文件，可以用于文件校验，
uploader.on('filesAdded', function (files, fileList, event) {
  console.log('filesAdded', files, fileList, event)
})
// 文件已经加入到上传列表中，一般用来开始整个的上传
uploader.on('filesSubmitted', function (files, fileList, event) {
  // files 是本次加入到上传列表中的文件，uploader.files 是已经加入到上传列表中的全部文件
  console.log('filesSubmitted', files, fileList, event)
})
// 一个文件被移除
uploader.on('fileRemoved', function (file) {
  console.log('fileRemoved', file)
})
```
### 常用 API
#### 配置项
见[原有配置](https://github.com/simple-uploader/Uploader/blob/develop/README_zh-CN.md#%E9%85%8D%E7%BD%AE)，已经基于业务逻辑，改了很多默认的配置项，所以大多数不需要修改
- target：可以是一个函数，用来返回接口地址，函数参数为文件 file，分片 chunk，是否是进度检查的请求 isTest，是否是合并请求 isMerge。根据不同情况，返回不同接口地址 url
- processParams：可以是一个函数，用来返回接口需要的参数，函数参数为默认参数 params，文件 file，分片 chunk，是否是进度检查的请求 isTest，是否是合并请求 isMerge。根据不同情况，返回不同接口需要的参数
- autoUpload（新增）：是否选择文件后自动开始上传，默认为 false
- hashType（新增）：用来配置计算文件唯一 id 的方式，默认是 xxhasm，可以配置成 md5，但需要和后端保持一致，否则会导致合并失败
- statusText（新增）：用来配置文件上传过程中不同状态的文字内容
#### 方法
见[原有方法](https://github.com/simple-uploader/Uploader/blob/develop/README_zh-CN.md#%E6%96%B9%E6%B3%95)
手动开始上传时，调用 resume() 方法，不要调用 upload() 方法
#### 事件
在[原有事件](https://github.com/simple-uploader/Uploader/blob/develop/README_zh-CN.md#%E4%BA%8B%E4%BB%B6)的基础上，增加了 `calcHashStart`、`calcHashEnd`、`fileMergeStart`、`fileMergeEnd`、`fileStatus` 几个事件
- uploader.on('calcHashStart', function(file) {})：开始计算文件唯一 id 时的事件，回调参数为当前文件 file
- uploader.on('calcHashEnd', function(file, hash) {})：计算文件唯一 id 完成时的事件，回调参数为当前文件 file，文件 hash
- uploader.on('fileMergeStart', function(file) {})：开始合并文件时的事件，回调参数为当前文件 file
- uploader.on('fileMergeEnd', function(file) {})：合并文件结束时的事件，回调参数为当前文件 file
- uploader.on('fileStatus', function(file, status, statusText) {})：文件上传的当前状态，有等待上传、正在计算唯一 id、上传中、上传暂停、合并中、上传成功、上传出错等几种情况，回调参数为当前文件 file，状态 status，状态文本 statusText，可以通过 uploader 的配置项 statusText 修改文本内容