uploader

上传文件到S3兼容服务组件

调用方法

ES6

import Upload from '@xlab/uploader/es'

ES5:

const Upload require('@xlab/uploader/lib')

API

| Field | Type | Description | | ----- | ---- | ----------- | | directory | String | S3目录 | | bucket | String | S3桶名称 | | action | URL | S3签名地址 | | headers | Object | HTTP请求头 | | onStart | Func | 开始上传回调函数 | | onSuccess | Func | 上传成功回调函数 | | onError | Func | 上传错误回调函数 | | onProgress | Func | 上传进度回调函数 |

有些API需要认证，可以在HTTP请求头加上 Authorization: Bearer ${TOKEN}

返回参数

onStart

| 参数 | 类型 | 描述 | | ---- | ---- | ---- | | file | File | 文件 |

onSuccess

| 参数 | 类型 | 描述 | | ---- | ------ | --------------------------------------------------------- | | ret | Object | {Bucket:String, ETag:String, Key:String, Location:String} | | file | File | 文件 |

onError

onProgress

Example

import React, {Component} from 'react'
import {render} from 'react-dom'

import Uploader from '@xlab/uploader'

class Demo extends Component {
  render() {
    return (
      <div>
        <h1>uploader Demo</h1>
        <Uploader
          directory="uploadDemo/"
          bucket="pku.digital-cdn.com"
          action="http://127.0.0.1:4000/api/v1/s3/signature"
        >
          <button>开始上传</button>
        </Uploader>
      </div>
    )
  }
}

render(<Demo />, document.querySelector('#demo'))