file-upload-utils
处理大文件上传、秒传、断点+续传的工具包
功能实现:
大文件上传
- 文件切成分片 √
- 分片 hash 生成 √
- 合并上传 √
- 并发控制 √
- 进度条提示 √
小文件直传
文件秒传 √
使用示例
import { useState } from 'react';
import SliceUpload from "./upload";
import { SliceUploadFileChunk } from './type';
interface IOptions {
chunkSize?: number
poolCount?: number
}
export function useSliceUpload(options: IOptions) {
const [totalProgress, setTotalProgress] = useState(0);
const [chunks, setChunks] = useState([])
const instance = new SliceUpload({});
const updateChunks = () => {
const data = instance.getChunkData()
setChunks(data)
}
// 设置上传请求
instance.setUploadRequest((params: SliceUploadFileChunk) => {
// 文件数据
const data = new FormData()
data.append('chunk', params.chunk);
data.append('index', String(params.index));
data.append('chunkHash', params.chunkHash);
data.append('chunkName', params.chunkName);
data.append('chunkTotal', String(params.chunkTotal))
const options = {
url: "http://localhost:8888/upload/",
method: "POST" as const,
data,
}
return options
})
// 进度条
instance.on('progress', (result) => {
console.log(result.progress);
setTotalProgress(result.progress);
updateChunks()
});
return {
chunks,
totalProgress,
}
}