# file-slice-upload

> file-slice-upload

Latest version **2.0.2** (published 2022-03-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install file-slice-upload
pnpm add file-slice-upload
yarn add file-slice-upload
bun add file-slice-upload
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.0.2 |
| Published | 2022-03-21 |
| First published | 2021-12-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 46.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | https://github.com/zhao-huo-long |
| Maintainers | zhao-huo-long |
| Keywords | file, slice, upload, 分片上传, 大文件, big-file, slice-upload, 文件上传, file-chunk |

## Links

- npm: https://www.npmjs.com/package/file-slice-upload
- Repository: https://github.com/zhao-huo-long/file-slice-upload
- Homepage: https://github.com/zhao-huo-long/file-slice-upload#readme
- Issues: https://github.com/zhao-huo-long/file-slice-upload/issues
- npm.io page: https://npm.io/package/file-slice-upload

## Dependencies (3)

- [spark-md5](https://npm.io/package/spark-md5.md) ^3.0.2
- [assert-tiny](https://npm.io/package/assert-tiny.md) ^1.0.1
- [emitter-tiny](https://npm.io/package/emitter-tiny.md) ^1.0.0

## Alternatives

- [unionfs](https://npm.io/package/unionfs.md) — 2.2M weekly downloads
- [path-starts-with](https://npm.io/package/path-starts-with.md) — 35.9K weekly downloads
- [redzip](https://npm.io/package/redzip.md) — 1.2K weekly downloads
- [vscode-anymatch](https://npm.io/package/vscode-anymatch.md) — 848 weekly downloads
- [@ledgerhq/coin-filecoin](https://npm.io/package/@ledgerhq/coin-filecoin.md) — 793 weekly downloads

## Recent versions

- 2.0.2 (latest) — 2022-03-21
- 2.0.1 — 2022-03-21
- 2.0.0 — 2022-03-20
- 1.0.6 — 2022-03-14
- 1.0.5 — 2022-03-14
- 1.0.4 — 2021-12-28
- 1.0.3 — 2021-12-17
- 1.0.2 — 2021-12-11
- 1.0.1 — 2021-12-08
- 1.0.0 — 2021-12-08

## README

# 📄 File-Slice-Upload

<!-- [english](./README_en.md) -->

## 快速开始

### 1. 安装
  * 使用 npm 安装
  ```shell
  npm install file-slice-upload
  ```
  * 使用 yarn 安装
  ```shell
  yarn add file-slice-upload
  ```
### 2. 使用 file-slice-upload 上传文件碎片
```tsx
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

1. [live-demo-原生](https://zhao-huo-long.github.io/file-slice-upload/demo/demo.html)
2. [live-demo-react](http://120.25.173.175/file-slice-upload-client/dist/index.html)
   demo源码: [github](https://github.com/zhao-huo-long/file-slice-instance.git)
## 🔥🔥🔥 特点
1. 只需专注上传逻辑!
2. 友好、易读的 api `.start()` `.cancel()`
3. 支持事件 `start` `finish` `stop` `progress` `error`, 降低代码耦合
4. 轻量
5. 使用 typescript 编码, 类型提示良好

### API文档

#### 默认导出
`FileSliceUpload`类的工厂函数，返回 `FileSliceUpload` 实例
1. `factory(chunkSize)` => `FileSliceUpload`

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

#### FileSliceUpload 类
方法列表
1. `setFile(file)` => `this`

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

2.  `fileUpload.setAjax(ajax)`  => `this`

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

3.  `fileUpload.start()` 开始上传
4.  `fileUpload.cancel()` 取消上传
5.  `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` |

6.  `fileUpload.getFile()` => `file` 获取原始完整文件

7. `fileUpload.off(eventName, cb)` => `this` 取消事件注册

---
_Source: https://npm.io/package/file-slice-upload · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._