oss-upload.js/src/index.js

The browser directly uploads files to oss

import { Observable } from "rxjs";
import { fileMd5 } from "./fileMd5";
const OSS = require("ali-oss");
let ossClient;

// 小文件put上传
function put_upload(_ossConfig, _observer) {
  ossClient
    .put(`${_ossConfig.folder}/${_ossConfig.filename}`, _ossConfig.fileObj)
    .then(uploadResponse => {
      if (uploadResponse.res.status === 200) {
        _observer.next({
          status: 200,
          data: uploadResponse.url.replace(/http:/, "https:")
        });
      } else {
        _observer.next({ status: 400, data: "" });
      }
    });
}

// 大文件分片上传
function multipart_upload(_ossConfig, _observer) {
  ossClient
    .multipartUpload(
      `/${_ossConfig.folder}/${_ossConfig.filename}`,
      _ossConfig.fileObj,
      {
        progress: _percent => {
          _observer.next({ status: 300, data: _percent * 100 });
        },
        partSize: 5 * 1024 * 1024
      }
    )
    .then(uploadResponse => {
      if (uploadResponse.res.status === 200) {
        _observer.next({
          status: 200,
          data: `${_ossConfig.bucket}${uploadResponse.name}`
        });
      } else {
        _observer.next({ status: 400, data: "" });
      }
    });
}

//  传入oss配置、oss bucket、oss目标文件夹、File对象、自定义文件名
function oss_upload(inputObj) {
  return Observable.create(observer => {
    let ossConfig = {
      license: inputObj.license,
      bucket: `https://${inputObj.license.bucket}.${inputObj.license.region}.aliyuncs.com`,
      folder: inputObj.folder,
      fileObj: inputObj.fileObj,
      filename: inputObj.fileName
    };
    try {
      ossClient = new OSS(inputObj.license);
    } catch (e) {
      console.error("Error: oss init file，please check your oss config");
    }
    // 若未传入文件名，则将文件的MD5值设为文件名
    if (!inputObj.hasOwnProperty('fileName') || !inputObj.fileName) {
      fileMd5(inputObj.fileObj, (err, md5Result) => {
          ossConfig.filename = `${md5Result}.${inputObj.hasOwnProperty('fileExtension') && inputObj.fileExtension?inputObj.fileExtension:
          inputObj.fileObj.type.slice(inputObj.fileObj.type.search(/\//) + 1)}`;
        // 根据文件大小选择上传方式
        inputObj.fileObj.size < 20 * 1024 * 1024
          ? put_upload(ossConfig, observer)
          : multipart_upload(ossConfig, observer);
      });
    } else {
      // 根据文件大小选择上传方式
      inputObj.fileObj.size < 20 * 1024 * 1024
        ? put_upload(ossConfig, observer)
        : multipart_upload(ossConfig, observer);
    }
  });
}

export { oss_upload as default };