JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 2
  • Score
    100M100P100Q28510F
  • License MIT

前端文件上传插件,支持分片上传,并发上传,文件续传,暂停上传,含多种上传事件,事件回调支持异步方法,高度可控及自定义化

Package Exports

  • js-upload-file
  • js-upload-file/dist/js-upload-file.min.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (js-upload-file) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

js-upload-file

npm-package npm-publish size license last-commit

一个前端文件上传插件

  • 支持多文件并发上传,分片上传,暂停上传,失败自动重传等;
  • 配合后端接口可实现文件续传;
  • 支持多种上传事件,便于对整个上传过程监听与控制;
  • 事件回调支持异步方法,便于实现事件的异步校验及相关业务逻辑;

详细文档

// 引入
import JsUploadFile from 'js-upload-file'
// 初始化
const myUpload = new JsUploadFile({
  server: '上传接口', // 上传接口
  auto: false, // 自动上传
  // file: [], // 初始化就加入上传的文件
  chunked: false, // 是否分片
  chunkSize: 1 * 1024 * 1024, // 分片大小
  maxFileParallel: 3, // 最大同时上传文件数
  maxAjaxParallel: 2, // 单个文件最大同时上传分片数
  maxRetry: 1, // 失败重试次数
  formDataKey: { // FormData使用的key
    file: 'file',
    hash: 'hash',
    chunk: 'count',
    chunks: 'index',
    splitSize: 'size',
    name: 'fileName'
  }
})
// 监听事件
myUpload.on('beforeUpFile', (obj) => {
  // 某文件上传前,执行异步方法校验
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve()
    }, 2000)
  })
})
myUpload.on('success', (obj) => {
  // 某文件上传成功
})
// 添加文件
myUpload.addFile(files)
// 开始上传
myUpload.start()
// 暂停上传
myUpload.pause()
// 移除文件
myUpload.remove()