微信小程序批量上传图片到七牛(推荐)


Posted in Javascript onDecember 19, 2019

一、引入七牛SDK

具体查看文档

https://github.com/gpake/qiniu-wxapp-sdk/blob/master/README.md

二、封装上传方法upload.js

/**
 * 上传函数
 */
const qiniuUploader = require("qiniuUploader");
const request = require("./request.js")
 
// 初始化七牛相关参数
function initQiniu() {
  var options = {
    uploadURL: 'https://up.qiniup.com',
    region: 'ECN', //
    uptokenURL: request.URL + 'qiniu-token?token=' + getApp().globalData.token,
    // uptoken: 'xxxx',
    domain: 'cdn-mpsoft.tujihome.com/',
  };
  qiniuUploader.init(options);
}
 
function upload(filePath, success, fail) {
  initQiniu();
  // 交给七牛上传
  qiniuUploader.upload(filePath, (res) => {
    success(res);
  }, (error) => {
    console.error('error: ' + JSON.stringify(error));
    fail(error);
  });
}
 
 
/**
 * 批量上传
 * @param images
 */
function batchUpload(images) {
  let uplist = []
  for (let index in images) {
    const path = images[index]['url'];
    const key = images[index]['key'];
    let promise = new Promise((resolve, reject) => {
      qiniuUploader.upload(path, (res) => {
        resolve(res.imageURL)
      }, (error) => {
        reject(error)
      },{
        uploadURL: 'https://up.qiniup.com',
        region: 'ECN', //
        uptokenURL: request.URL + 'qiniu-token?token=' + getApp().globalData.token,
        key: key,
        domain: 'cdn-mpsoft.tujihome.com/',
      });
    })
    uplist.push(promise)
  }
  Promise.all(uplist).then((resultList) => {
    console.log(resultList);
    return resultList;
  }, error => {
    console.log(error)
    throw err;
  })
}
 
module.exports = {
  'upload': upload,
  'BatchUpload' : batchUpload,
}

url:文件路径,key:文件名

batchUpload()传入数组,包含文件路径跟文件名,不需要自定义文件名可以修改下,只调用一次初始化方法,

返回值为包含所有文件路径的数组

三、调用

uploadImage(images) {
    var that = this
    var imageURL = [];
    for (var i of images) {
      i.key = 'gclw_' + Date.parse(new Date()) + Math.random() + '.jpg';
    }
 
    try {
      imageURL = upload.BatchUpload(images);
      return imageURL;
    } catch (e) {
      wx.showModal({
        title: '提示',
        content: e,
        showCancel: false,
      })
    }
  },

结果

微信小程序批量上传图片到七牛(推荐)

总结

以上所述是小编给大家介绍的微信小程序批量上传图片到七牛,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
点击文章内容处弹出页面代码
Oct 01 Javascript
jQuery实现点击文本框弹出热门标签的提示效果
Nov 17 Javascript
使用CSS样式position:fixed水平滚动的方法
Feb 19 Javascript
jQuery实现输入框下拉列表树插件特效代码分享
Aug 27 Javascript
深入浅析JS的数组遍历方法(推荐)
Jun 15 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
Jun 28 Javascript
最全面的百度地图JavaScript离线版开发
Sep 10 Javascript
js实现背景图自适应窗口大小
Jan 10 Javascript
a标签置灰不可点击的实现方法
Feb 06 Javascript
jQuery插件zTree实现更新根节点中第i个节点名称的方法示例
Mar 08 Javascript
JS关于刷新页面的相关总结
May 09 Javascript
JS拖拽排序插件Sortable.js用法实例分析
Feb 20 Javascript
echarts实现折线图的拖拽效果
Dec 19 #Javascript
Vue中使用Lodop插件实现打印功能的简单方法
Dec 19 #Javascript
Echarts实现单条折线可拖拽效果
Dec 19 #Javascript
Webpack设置环境变量的一些误区详解
Dec 19 #Javascript
Echarts实现多条折线可拖拽效果
Dec 19 #Javascript
js判断一个对象是数组(函数)的方法实例
Dec 19 #Javascript
利用JS如何获取form表单数据
Dec 19 #Javascript
You might like
PHP获取文件行数的方法
2015/06/10 PHP
PHP实现递归复制整个文件夹的类实例
2015/08/03 PHP
PHP递归遍历指定文件夹内的文件实现方法
2016/11/15 PHP
JavaScript OOP类与继承
2009/11/15 Javascript
javascript getElementsByClassName实现代码
2010/10/11 Javascript
jquery1.9 下检测浏览器类型和版本的方法
2013/12/26 Javascript
js 日期比较相关天数代码
2014/04/02 Javascript
教你在heroku云平台上部署Node.js应用
2014/07/30 Javascript
JavaScript基础教程之alert弹出提示框实例
2014/10/16 Javascript
JavaScript类型系统之基本数据类型与包装类型
2016/01/06 Javascript
Bootstrap3使用typeahead插件实现自动补全功能
2016/07/07 Javascript
js 去掉字符串前后空格实现代码集合
2017/03/25 Javascript
实例详解JavaScript中setTimeout函数的执行顺序
2017/07/12 Javascript
使用FileReader API创建Vue文件阅读器组件
2018/04/03 Javascript
vue实现底部菜单功能
2018/07/24 Javascript
React+Antd+Redux实现待办事件的方法
2019/03/14 Javascript
JavaScript中的 new 命令
2019/05/22 Javascript
基于vue.js实现购物车
2020/01/15 Javascript
javascript中contains是否包含功能实现代码(扩展字符、数组、dom)
2020/04/07 Javascript
Nuxt.js nuxt-link与router-link的区别说明
2020/11/06 Javascript
TensorFlow如何实现反向传播
2018/02/06 Python
Python使用pymongo库操作MongoDB数据库的方法实例
2019/02/22 Python
Python学习笔记基本数据结构之序列类型list tuple range用法分析
2019/06/08 Python
详解Python3中setuptools、Pip安装教程
2019/06/18 Python
python之mock模块基本使用方法详解
2019/06/27 Python
简单了解python的一些位运算技巧
2019/07/13 Python
用python的turtle模块实现给女票画个小心心
2019/11/23 Python
如何将json数据转换为python数据
2020/09/04 Python
美国羽绒床上用品第一品牌:Pacific Coast
2018/08/25 全球购物
自考毕业自我鉴定范文
2013/10/27 职场文书
大学生军训自我鉴定范文
2014/09/18 职场文书
运动会稿件100字
2014/09/24 职场文书
辞职信标准格式
2015/02/27 职场文书
校运会广播稿
2015/08/19 职场文书
SQL Server基本使用和简单的CRUD操作
2021/04/05 SQL Server
golang中的struct操作
2021/11/11 Golang