浏览器端 3.x 升级到 4.x 指南

差异

移除

• 图片处理

新增

• 支持 v1 分片上传接口

变更

接口形式变更

v3 的接口基于 observable 的设计范式，如下：

const observable = qiniu.upload(file, key, token, putExtra, config)
const subscription = observable.subscribe(observer) // 上传开始，并监听进度、错误等信息
subscription.unsubscribe() // 上传取消

在 v4 中，我们采用了更直接的 task 设计范式来对接口进行了重新的设计，减少无关概念的抽象，使其更简单直接。

const uploadTask = createMultipartUploadTask(fileData, config);
uploadTask.onProgress((progress, context) => {}); // 设置进度回调函数
uploadTask.onComplete((result, context) => {}); // 设置完成回调函数
uploadTask.onError((error, context) => {}); // 设置错误回调函数
uploadTask.start(); // 开始任务
uploadTask.cancel(); // 取消任务

除了接口形式，对应的相关参数和数据结构也发生了一些变化，具体参考 v4 的文档。

错误处理

由于移除了图片处理等模块， 4.x 的错误情况大大减少。

重命名 3.x 的 QiniuError 为 UploadError

UploadError 包含所有的网络和 SDK 层面的错误。其中网络错误被作为一个单独的 Class 声明 HttpRequestError, HttpRequestError 包含发生网络错误时的 httpCode 和错误 message 以及用来跟踪请求的 reqId

一般，你可以在上传任务的 onError 回调中获取和处理错误，示例代码如下：

newUploadTask.onError(error => {
  // 网络错误
  if (error instanceof HttpRequestError) {
    console.log(error.httpCode)
    console.log(error.message)
    console.log(error.reqId)
    return
  }

  // 其他 SDK 错误
  console.log(error)
})