微信小程序上传图片到阿里云

1.选择图片
2.请求后端签名
3.上传到阿里云
（具体参数根据需求而定，各家公司的情况都不相同）

//上传图片
uploadImage2: function () {var that = this;let imgList = this.data.shopData[3].val;//图片数组[]//1.选择图片wx.chooseImage({count: 10, //设置最多可上传的数量success: (res) => {// console.log('选择图片成功', res);var tempPath = res.tempFilePaths;//微信生成的图片路径this.setData({['shopData[3].val']: imgList.concat(tempPath), //给显示图片的数组赋值})//选择图片成功回调wx.showLoading({title: '上传中',mask: true})//2.发起后端请求签名wx.request({url: 'your url',//你要请求的后端地址header: {'content-type': 'application/x-www-form-urlencoded',},success: function (res) {// console.log('请求成功', res);if (res.data.code == 200) {//多张图片用循环--上传for (var i = 0; i < tempPath.length; i++) {var l = tempPath[i].length;var newName = Date.parse(new Date()) + tempPath[i].substring(l - 10);//给图片重命名// console.log(newName);//3.发起请求，直传OSSwx.uploadFile({url: 'https:/xxx',//oss地址filePath: tempPath[i],name: 'file',header: {"Content-Type": "multipart/form-data"},formData: {// host：填写存储空间的访问域名，例如https://test.oss-cn-zhangjiakou.aliyuncs.com。若您的存储空间已绑定自定义域名，建议填写您的自定义域名。// signature：填写获取到的signature信息。// ossAccessKeyId：填写您的AccessKey ID，若是通过STS获取的临时用户，则填写临时用户的AccessKey ID。// policy：填写获取到的policy信息。// key：设置文件上传至OSS后的文件路径。例如需要将myphoto.jpg上传至test文件夹下，此处填写test/myphoto.jpg。// securityToken：若使用STS认证，此项填写步骤3中，使用客户端签名获取到的SecurityToken。// filePath：填写待上传文件的文件路径，例如：D:\example.txt。'key': res.data.data.dir + newName,//拼接图片路径名'policy': res.data.data.policy,'OSSAccessKeyId': res.data.data.accessid,'success_action_status': '200', //让服务端返回200,不然，默认会返回204'callback': res.data.data.callback,'signature': res.data.data.signature,},success: function (res) {wx.hideLoading();// console.log('上传成功', res)var imgsUrls = JSON.parse(res.data);that.setData({productInfoImgs: that.data.productInfoImgs.concat(imgsUrls.data.filename)})// console.log(that.data.productInfoImgs);},fail: (err) => {wx.hideLoading()wx.showToast({title: '上传图片失败',icon: 'none',duration: 2000})}})}}},fail: (err) => {wx.hideLoading();wx.showToast({title: '请求失败',icon: 'none',duration: 2000})}})},fail: (err) => {// wx.hideLoading();// wx.showToast({//   title: '选择图片失败',//   icon:'none',//   duration:2000// })}})},

微信小程序上传图片到阿里云相关推荐

微信小程序上传图片到阿里云oss方法
最近开发微信小程序要求上传图片到阿里云oss上,所以就顺手整理一下整个过程啦. 前提开通oss服务和创建oss存储空间啦(这个就自己去解决吧)下面接入正题: 步骤一:配置 Bucket 跨域客户端 ...
微信小程序上传图片到阿里云OSS
微信小程序代码 1.wxml: <image src="{{userInfo.headImg}}" class="user-head_img" bindt ...
微信小程序上传阿里云OSS，返回204,400,403,405,解决方案
目录微信小程序上传阿里云 ==OSSAccessKeyId,policy,signature==如何获取呢? 配置Bucket跨域访问配置外网域名到小程序的域名白名单上传报错(返回400,403 ...
微信小程序录音直传阿里云OSS并语音识别
前言如题:做一个录音文字识别功能,知识点有三个,分别是微信小程序的录音功能.录音文件直传阿里云OSS.使用阿里云的录音文件识别接口返回识别后的文字一.微信小程序录音官方文档:微信小程序全局唯一的 ...
微信小程序/vue通过阿里云上传图片
1.首先前端放入获取上传的组件微信小程序uview组件: https://www.uviewui.com/components/upload.html vue所使用的element组件: https ...
Javaweb和微信小程序项目部署阿里云服务器总结(上)
谈到微信小程序的java后台怎么部署在阿里云服务器上的问题,弯弯绕绕,好多坑,网上的博客资料也特别乱,博主也是在没有任何经验和指导下花了几天的工夫才完成的.这里为了方便大家不踩坑,总结了下整个流程和注 ...
微信小程序上传阿里云视频文件流程及代码
为了微信小程序客服端实现自拍视频能够分享给多个好友,我们需要把小程序自拍的视频存储到服务器,而阿里云在性能和速度上比较不错,所以我们选择了阿里云作服务器. 第一步.微信小程序项目创建 1. 到http ...
微信小程序MQTT模拟器阿里云物联网平台测试
陈拓 chentuo@ms.xab.ac.cn 2019.09.27/2020.01.20 原文参考:微信小程序-MQTT模拟器 https://www.yuque.com/cloud-dev/iot ...
uniapp(微信小程序)上传图片到阿里oss
首先推荐下参考的文章 1.https://www.jianshu.com/p/34d6dcbdc2e5 2.https://help.aliyun.com/document_detail/92883. ...
微信小程序图片无法存入云开发数据库，求解决
微信小程序图片无法存入云开发数据库,求解决上传图片的js代码片段上传图片的js代码片段上传图片的js代码片段,觉得自己代码的没错,也能打印出来上传的图片地址,但是发现并没有存进数据库,求大神指点 ...

微信小程序上传图片到阿里云

微信小程序上传图片到阿里云

微信小程序上传图片到阿里云相关推荐

最新文章

热门文章