微信小程序上传图片到七牛云支持多张

最新推荐文章于 2023-09-11 11:05:28 发布

kingrome2009

最新推荐文章于 2023-09-11 11:05:28 发布

阅读量2.3k

点赞数

CC 4.0 BY-SA版权

分类专栏：微信小程序

本文链接：https://blog.youkuaiyun.com/kingrome2017/article/details/86776252

本文介绍了如何在微信小程序中实现图片上传至七牛云的服务，包括封装的qiniuUploader.js和publishashx.js两个关键组件的详细代码实现。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

封装七牛云上传方法 qiniuUploader.js

(function () {
   
   

  var config = {
   
   
    qiniuRegion: '',
    qiniuImageURLPrefix: '',
    qiniuUploadToken: '',
    qiniuUploadTokenURL: '',
    qiniuUploadTokenFunction: null,
    qiniuShouldUseQiniuFileName: false
  }

  module.exports = {
   
   
    init: init,
    upload: upload,
  }

  // 在整个程序生命周期中，只需要 init 一次即可
  // 如果需要变更参数，再调用 init 即可
  function init(options) {
   
   
    config = {
   
   
      qiniuRegion: '',
      qiniuImageURLPrefix: '',
      qiniuUploadToken: '',
      qiniuUploadTokenURL: '',
      qiniuUploadTokenFunction: null,
      qiniuShouldUseQiniuFileName: false
    };
    updateConfigWithOptions(options);
  }

  function updateConfigWithOptions(options) {
   
   
    

    if (options.region) {
   
   
      config.qiniuRegion = options.region;
    } else {
   
   
      console.error('qiniu uploader need your bucket region');
    }
    if (options.uptoken) {
   
   
      config.qiniuUploadToken = options.uptoken;
    } else if (options.uptokenURL) {
   
   
      config.qiniuUploadTokenURL = options.uptokenURL;
    } else if (options.uptokenFunc) {
   
   
      config.qiniuUploadTokenFunction = options.uptokenFunc;
    }
    if (options.domain) {
   
   
      config.qiniuImageURLPrefix = options.domain;
    }
    config.qiniuShouldUseQiniuFileName = options.shouldUseQiniuFileName
  }

  function upload(filePath, success, fail, options, progress, cancelTask) {
   
   
    

    if (null == filePath) {
   
   
      console.error('qiniu uploader need filePath to upload');
      return;
    }
    if (options) {
   
   
      
      updateConfigWithOptions(options);
    }
    if (config.qiniuUploadToken) {
   
   
     
      doUpload(filePath, success, fail, options, progress, cancelTask);
    } else if (config.qiniuUploadTokenURL) {
   
   
     
      getQiniuToken(function () {
   
   
        doUpload(filePath, success, fail, options, progress, cancelTask);
      });
    } else if (config.qiniuUploadTokenFunction) {
   
   
      
      config.qiniuUploadToken = config.qiniuUploadTokenFunction();
      if (null == config.qiniuUploadToken && config.qiniuUploadToken.length > 0) {
   
   
        console.error('qiniu UploadTokenFunction result is null, please check the return value');
        return
      }
       
      doUpload(filePath, success, fail, options, progress, cancelTask);
    } else {
   
   
      console.error('qiniu uploader need one of [uptoken, uptokenURL, uptokenFunc]');
      return;
    }
  }

  function doUpload(filePath, success, fail, options, progress, cancelTask) {
   
   
    if (null == config.qiniuUploadToken && config.qiniuUploadToken.length > 0) {
   
   
      console.error('qiniu UploadToken is null, please check the init config or networking');
      return
    }

    var url = uploadURLFromRegionCode(config.qiniuRegion);
    
    var fileName = filePath.split('//')[1];
    if (options && options.key) {
   
   
      fileName = options.key;
    }
    var formData = {
   
   
      'token': config.qiniuUploadToken