Awesome Open Source
Awesome Open Source

A tiny qiniu sdk for uploading file. (browser only)

Differences from qiniu.js

  • Smaller
  • No UI
  • Support upload base64 string


  • Qiniu developer account
  • Promise polyfill for old version browser


Using npm:

$ npm install tiny-qiniu

Using yarn:

$ yarn add tiny-qiniu




import TinyQiniu from 'tiny-qiniu';

const config = {
    bucket: 'my_bucket', // qiniu bucket name, requried

    /* one of `baseURL` or `mapResponse` is required */
    baseURL: '', // qiniu bucket domain, requried

    mapResponse: (data) => data, // a function to map final response data

    /* one of `uptoken`, `uptokenUrl`, `uptokenFunc` is required */

    // use a static uptoken string, it's NOT recommended
    uptoken: 'your_upload_token',

    // or use an url to dynamically get uptoken, should return json with `{ uptoken: 'uptoken_from_server' }`
    uptokenUrl: 'http://localhost/api/uptoken',

    // save zone
    // z0 - 华东 (by default), z1 - 华北, z2 - 华南, na0 - 北美
    zone: 'z2',

    // or use a function to dynamically return uptoken string
    uptokenFunc: () => {
        const fakeFetch = () => new Promise((resolve) => {
            setTimeout(() => resolve('my_uptoken'), 1000)

        return fakeFetch('/fake/api'); // return a promise

    mapUptoken: (data) => data.uptoken || data, // Optional, a function to map uptoken when fetch uptoken completed

    mapResponseURL: (url, hash, key, data) => url, // Optional, a function to map final url
const tinyQiniu = new TinyQiniu(config);

TinyQiniu#uploadFile(file[, options])

Upload with a file object. You can also provide a remote file name by adding options.key as the second argument. Returns a promise.

options (Object)
  • key (String): Remote file name
  • onProgress (Function): The function called periodically with information when an upload request before success completely.


var file = document.querySelector('#fileInput').files[0];
tinyQiniu.uploadFile(file, { key: 'my_file_name' }).then((resp) => console.log(resp.url));

TinyQiniu#uploadBase64(base64String[, options])

Upload with a base64 string. You can also provide a remote file name by adding options.base64key as the second argument. Returns a promise.

NOTE base64key should provide a base64 string. You can use btoa() or some other library to generate it.


const base64Key = btoa('my_file_name');
tinyQiniu.uploadBase64(base64String, { base64key }).then((resp) => console.log(resp.url));

Available Zones

  • z0: (default)
  • z1:
  • z2:
  • na0:

Please checkout for detail


  • It is recommended to setup a server to get uptoken for security. To setup a uptoken server, please checkout /test/server
  • If you are looking for a react component, tiny-qiniu-request is a good helper


Please checkout the contributing page


Please checkout the Releases page



Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (70,903
sdk (528
promise (205
upload (118
base64 (36
qiniu (26
upload-file (16