微信小程序遇到的坑系列---小程序上传图片线上失败

微信小程序中，上传图片的代码如下：

实现功能：

1.上传图片到七牛云

2.上传成功后，对于返回的路径展示到页面

3.将返回的路径发送给后端

对于第一个需求：

1.上传图片到七牛云

我们需要在七牛云上有一个账号去存自己的图片，于是不能忽略的一步，就是在进入页面时候，获取到七牛云的token

2.上传成功后，对于返回的路径展示到页面

这里又分为两个需求：

②将上传成功后的图片展示到页面上；

upzhengmian: function () {

var that = this

①上传图片到七牛云；

wx.chooseImage({

count: 1,

success: function (res) {

console.log(app.data.uptoken)

var tempFilePaths = res.tempFilePaths[0]

这里的token是第一步获取到的uptoken，写在app.js里面的

let token = app.data.uptoken;

wx.uploadFile({

这里配置的接口是上传图片的接口，但是这里有一个坑，后面会说；

url: ‘http：....../upload’,

name: 'file',

filePath: tempFilePaths,

header: {

"Content-Type": "multipart/form-data"

formData: {

token: encodeURI(token),

success: function (res) {

这一步就是上传成功后，展示到页面上了

that.data.img1 = config.systemData.QiNiuUrl + '/' + JSON.parse(res.data).hash

that.setData({

img1: that.data.img1

})

fail: function (res) {

wx.showModal({

title: '',

content: '上传身份证失败,请重新上传',

duration: '2000'

})

}

})

fail: function (res) {

}

})

写到这一步，其实已经可以实现在开发工具上上传图片了，于是我们上传了代码到体验版的时候，图片就上传失败了。

配置地址没问题的情况下，就是不对；

其实问题并不大，只需要把开发工具上的地址配置检查是否是https：就可以了，因为微信小程序所有的配置合法域名都是https

然后就解决啦

微信小程序遇到的坑系列---小程序上传图片线上失败相关推荐

【踩坑系列】mysql 修改root密码失败
[踩坑系列] mysql 修改root密码失败问题原因 mysql 修改root密码失败 ,主要是因为root的host不是localhost,是%的问题. 修改密码的步骤 -- 切换到 mysql ...
金融系列白皮书 |《金融业线上渠道转型的方法与实践》上线
今日,神策数据推出金融行业数字化转型系列白皮书之<金融业线上渠道转型的方法与实践>,聚焦金融业数字化转型的常见问题,提出金融业的数字化转型基本思路,并附以金融业数字化转型 MVP 实践. ...
微信小程序开发踩坑经验——小蜗社群
2019独角兽企业重金招聘Python工程师标准>>> 之前遇到并且解决的坑,这边也渐渐忘记了,在这里就不列出来了-- 1.wx.redirectTo和wx.navigateTo ...
微信小游戏：Cocos Creator《守卫竹林》线上游戏源码资源分享
<守卫竹林>源码资源分享 <守卫竹林>的云开发方式与文章微信小游戏:云开发(三)云开发和CocosCreator解决方案介绍的相同,可以作为参考 <守卫竹林>下载链 ...
微信公众号可快速创建“门店小程序” 不用开发
"门店小程序"是啥?"门店小程序"是小程序的一项新能力.无需开发,商户就可在微信公众号后台快速创建"门店小程序".这个小程序类似一张&quo ...
计算机毕业设计springboot+vue基本微信小程序的线上服装店系统-服装商城
项目介绍服装行业是一个传统的行业.根据当前发展现状,网络信息时代的全面普及,服装行业也在发生着变化,单就服饰这一方面,利用手机购物正在逐步进入人们的生活.传统的购物方式,不仅会耗费大量的人力.时间, ...
从小程序背后的理念挖掘小程序的方方面面
全文较长,我先将核心观点列在这里: 小程序的理念是所见即所得,这是未来应用程序的理念: 小程序是场景化的,核心场景在于线下的服务载体.纯线上的和大公司的应用不适合小程序: 小程序和APP绝不是替代关系 ...
微信vue路由跳转兼容_Vue微信公众号开发踩坑记录
需求微信授权登录(基于公众号的登录方案) 接入JS-SDK实现图片上传,分享等功能现状及难点采用的Vue框架,前后端分离模式(vue工程仅作为客户端),用户通过域名访问的是客户端,但是微信授权中 ...
两百条微信小程序开发跳坑指南（不定时更新）
2019独角兽企业重金招聘Python工程师标准>>> 微信小程序联盟出品跳坑textarea<二百二十三>不显示文本及textarea相关问题集合跳坑<二百一 ...

微信小程序遇到的坑系列---小程序上传图片线上失败

微信小程序遇到的坑系列---小程序上传图片线上失败相关推荐

最新文章

热门文章