File-slice-upload NPM

📄 File-Slice-Upload

快速开始

1. 安装

使用 npm 安装
```
npm install file-slice-upload
```
使用 yarn 安装
```
yarn add file-slice-upload
```

2. 使用 file-slice-upload 上传文件碎片

import fileUpload from 'file-slice-upload'
fileUpload(1024 * 1024)
.setFile(youFile)
.setAjax(async({chunk, md5})=>{
  const success = await postChunkFile(chunk, md5)
  return success   /* 返回 true 将会上传下一个文件碎片 */
})
.start()

在线demo

live-demo-原生
live-demo-react demo源码: github

🔥🔥🔥 特点

只需专注上传逻辑!
友好、易读的 api .start() .cancel()
支持事件 start finish stop progress error, 降低代码耦合
轻量
使用 typescript 编码, 类型提示良好

API文档

默认导出

FileSliceUpload类的工厂函数，返回 FileSliceUpload 实例 1. factory(chunkSize) => FileSliceUpload

参数名	类型	必传	说明
chunkSize	int	false	分片大小(BYTE), 默认值1024 * 1024(1MB)

FileSliceUpload 类

方法列表 1. setFile(file) => this

参数名	类型	必传	说明
file	File	true	分片上传的文件

fileUpload.setAjax(ajax) => this

参数名	类型	必传	说明
ajax	`({chunk: File, index: number, md5: string, all: number}) => Promise<boolean>`	true	上传文件碎片的函数，该函数被调用返回true就上传下一个碎片

fileUpload.start() 开始上传
fileUpload.cancel() 取消上传
fileUpload.on(eventName, cb) => this 监听上传事件

eventName	说明	cb函数类型
start	开始上传	`() => void`
finish	上传完成	`({ file: File, chunkSize: number, md5: string, all: number }) => void`
cancel	取消上传	`() => void`
progress	上传进度	`({done: number, all: number, type: 'md5' \| 'upload'}) => void`
chunk-uploaded	分片上传成功	`({chunk: File, index: number, file: File, md5: string}) => void`
error	上传失败	`() => void`