Skip to content

DavidKk/qiniu-uploader

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.

GitHub version npm version js-standard-style

Build Status codecov Document Dependency Status

Build Status GitHub LICENSE

七牛上传控件

事例

文档

安装

yarn add qiniup

特点

  • 支持分块分片上传
  • 支持断点续传
  • 支持 base64 文件上传

使用

import { Uploader } from 'qiniup'

// Docs: https://doc.esdoc.org/github.com/DavidKk/qiniu-uploader/class/src/uploader.js~Uploader.html#instance-constructor-constructor
let qiniup = new Uploader()

let params = { token: 'generated by sdk' }

// Docs: https://doc.esdoc.org/github.com/DavidKk/qiniu-uploader/class/src/uploader.js~Uploader.html#instance-method-upload
qiniup.upload(file, params, { resumingByFileSize: 4 * 1024 * 1024 /** 默认也为 4M, 如果大于4M则使用分块分片(同时支持断点续传)上传 */ }, function (error) {
  if (error) {
    console.log(error)
    return
  }

  // upload success, somthing todo...
})

动态获取 token

let qiniup = new Uploader({
  tokenGetter (callback) {
    // do some async or sync request logic to get token
    callback(null, token)

    // or
    // 同时也可以设置过期时间(在 0.2.0 版本以上才适用)
    callback(null, { token, expire })
  }
})

获取上传状态

let progress = (event) => {
  console.log('当前进度为', event.loaded)
  console.log('总进度为', event.total)
  console.log('进程百分比', event.loaded / event.total)

  console.log('上传事件类型', event.type)
  console.log('当前上传进程', event.process)
  console.log('所有已注册上传进程', event.processes)
}

// `resumingByFileSize = 0` 表示一定使用分段上传
qiniup.upload(file, params, { resumingByFileSize: 0, progress }, function () {
  // do something...
})