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


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 相关文章推荐
彪哥1.1(智能表格)提供下载
Sep 07 Javascript
js模拟类继承小例子
Jul 17 Javascript
js 阻止子元素响应父元素的onmouseout事件具体实现
Dec 23 Javascript
百度判断手机终端并自动跳转js代码及使用实例
Jun 11 Javascript
jquery实现对联广告的方法
Feb 05 Javascript
使用RequireJS库加载JavaScript模块的实例教程
Jun 06 Javascript
浅谈JavaScript 函数参数传递到底是值传递还是引用传递
Aug 23 Javascript
获取今天,昨天,本周,上周,本月,上月时间(实例分享)
Jan 04 Javascript
原生js实现商品放大镜效果
Jan 12 Javascript
JavaScript修改注册表实例代码
Jan 05 Javascript
vue-cli单页面预渲染seo-prerender-spa-plugin操作
Aug 10 Javascript
Vue单页面应用中实现Markdown渲染
Feb 14 Vue.js
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 SPL标准库之数据结构堆(SplHeap)简单使用实例
2015/05/12 PHP
php限制文件下载速度的代码
2015/10/20 PHP
ThinkPHP框架搭建及常见问题(XAMPP安装失败、Apache/MySQL启动失败)
2016/04/15 PHP
Yii数据读取与跳转参数传递用法实例分析
2016/07/12 PHP
php实现微信支付之现金红包
2018/05/30 PHP
JavaScript中常见陷阱小结
2010/04/27 Javascript
js 设置选中行的样式的实现代码
2010/05/24 Javascript
style、 currentStyle、 runtimeStyle区别分析
2010/08/01 Javascript
jquery.tmpl JQuery模板插件
2011/10/10 Javascript
jquery异步跨域访问代码
2013/06/28 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
node.js实现逐行读取文件内容的代码
2014/06/27 Javascript
jQuery UI Bootstrap是什么?
2016/06/17 Javascript
原生js的ajax和解决跨域的jsonp(实例讲解)
2017/10/16 Javascript
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
2019/05/27 jQuery
ES6 Promise对象的含义和基本用法分析
2019/06/14 Javascript
python抓取某汽车网数据解析html存入excel示例
2013/12/04 Python
Ubuntu 16.04 LTS中源码安装Python 3.6.0的方法教程
2016/12/27 Python
Python编程scoketServer实现多线程同步实例代码
2018/01/29 Python
pandas series序列转化为星期几的实例
2018/04/11 Python
对python的unittest架构公共参数token提取方法详解
2018/12/17 Python
python实现网站用户名密码自动登录功能
2019/08/09 Python
Python pandas库中的isnull()详解
2019/12/26 Python
浅谈在JupyterNotebook下导入自己的模块的问题
2020/04/16 Python
严选全球尖货,立足香港:Bonpont宝盆
2018/07/24 全球购物
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
澳大利亚领先的亚麻品牌:Bed Threads
2019/12/16 全球购物
小学生新学期寄语
2014/01/19 职场文书
大学学习计划书范文
2014/05/02 职场文书
酒店管理专业自荐信
2014/05/23 职场文书
政府班子四风问题整改措施
2014/10/04 职场文书
初中生散播谣言检讨书
2014/11/17 职场文书
小学教师2014年度工作总结
2014/12/03 职场文书
高考作弊检讨书1500字
2015/02/16 职场文书
小人国观后感
2015/06/11 职场文书
银行求职信范文
2019/05/13 职场文书