微信小程序 wx.uploadFile无法上传解决办法


Posted in Javascript onDecember 14, 2016

微信小程序 wx.uploadFile无法上传解决办法

微信安卓客户端无法使用wx.uploadFile上传文件的问题有不少开发者都遇到。

我也因为一直不能解决,硬着头皮提交审核最后被拒(抱着审核者最好用iOS检测的心态,不巧审核我应用的用的是安卓),才尝试使用第三方的手段解决。

最终我是用了七牛第三方存储的方式,将文件直接上传至七牛的储存的空间上再回调使用。

当然像又拍云,万象优图这些第三方存储源都可以采用这种思路。

首先是将七牛的https上传域名放进小程序的域名名单中。

这里我使用的是七牛华东区的域名https://up.qbox.me。

微信小程序wx.uploadFile采用的是multipart/form-data方式上传,即表单上传。

根据七牛的官方文档说明 http://developer.qiniu.com/docs/ ... up/form-upload.html

微信小程序 wx.uploadFile无法上传解决办法

主要需要的就是file(文件本身)和token(上传凭证)。

然后在服务端部署获取上传凭证的业务代码,通过wx.request请求获取token。

var that = this;

   wx.request({

    url: 'https://xxx/token',

    method: 'POST',

    data: {},

    header: {

     'content-type':'application/x-www-form-urlencoded'

    },

    success: function(res) {

      that.token = res.data; //默认返回一个token,赋值给已经有的token属性。这里只是示例,具体根据需求可自行设定。

    },

    fail:function (res) {

     console.log(res)

    }

   })

 具体如何部署七牛凭证代码,可参考http://78re52.com1.z0.glb.cloudd ... %9C%8D%E5%8A%A1.pdf

获得凭证后就可以通过wx.uploadFile上传了。具体代码为:

var that = this;

  var key = Math.random().toString(36).substr(2); //生成一个随机字符串的文件名

  wx.uploadFile({

   url: 'https://up.qbox.me',

   filePath: flie,

   name: 'file',

   formData:{

    'token': that.token,//刚刚获取的上传凭证

    'key': key//这里是为文件设置上传后的文件名

   },

   success: function(r){

    var data = r.data;//七牛会返回一个包含hash值和key的JSON字符串

    if(typeof data==='string')data = JSON.parse(data.trim());//解压缩

    if(data.key){

     ... //这里就可以直接使用data.key,文件已经上传成功可以使用了。如果是图片也可以直接通过image调用。

    }

   },

   fail:function (res) {

    console.log(res)

   }

  })

最终采用这种方式解决了安卓无法上传文件的问题,当然上传自身服务器的问题还是有待解决。

不过对于急需解决方案的开发者还是提供了一个可行的方案。

现在利用第三方图源或存储源是一个普遍的方案,很多存储源例如七牛,又拍云,万象优图都提供了免费的空间供开发者使用。

建议大家也多做这方面的架构和尝试。

 感谢阅读,希望能帮助到大家,谢谢大家对本站 的支持!

Javascript 相关文章推荐
不间断滚动JS打包类,基本可以实现所有的滚动效果,太强了
Dec 08 Javascript
IE8对JS通过属性和数组遍历解析不一样的地方探讨
May 06 Javascript
Jquery.addClass始终无效原因分析
Sep 08 Javascript
JavaScript中跨域调用Flash的方法
Aug 11 Javascript
JSON取值前判断
Dec 23 Javascript
js兼容火狐显示上传图片预览效果的方法
May 21 Javascript
js实现简洁的滑动门菜单(选项卡)效果代码
Sep 04 Javascript
Jquery全屏相册插件zoomvisualizer具有调节放大与缩小功能
Nov 02 Javascript
基于JavaScript代码实现随机漂浮图片广告
Jan 05 Javascript
Express框架之connect-flash详解
May 31 Javascript
详细教你微信公众号正文页SVG交互开发技巧
Jul 25 Javascript
使用layui的router来进行传参的实现方法
Sep 06 Javascript
bootstrap日历插件datetimepicker使用方法
Dec 14 #Javascript
详解jQuery停止动画——stop()方法的使用
Dec 14 #Javascript
实例解析Array和String方法
Dec 14 #Javascript
利用JavaScript实现拖拽改变元素大小
Dec 14 #Javascript
微信小程序 五星评分(包括半颗星评分)实例代码
Dec 14 #Javascript
浅谈Javascript中的Label语句
Dec 14 #Javascript
详解jQuery中基本的动画方法
Dec 14 #Javascript
You might like
《被神捡到的男人》动画化计划进行中!
2020/03/06 日漫
php比较两个绝对时间的大小
2014/01/31 PHP
PHP实现微信提现功能(微信商城)
2019/11/21 PHP
js类中获取外部函数名的方法
2007/08/19 Javascript
jQuery中:text选择器用法实例
2015/01/03 Javascript
纯js代码实现未知宽高的元素在指定元素中垂直水平居中显示
2015/09/12 Javascript
基于JavaScript实现全屏透明遮罩div层锁屏效果
2016/01/26 Javascript
安装使用Mongoose配合Node.js操作MongoDB的基础教程
2016/03/01 Javascript
AngularJS入门教程之服务(Service)
2016/07/27 Javascript
javascript实现文字无缝滚动
2016/12/27 Javascript
JS如何获取地址栏的参数实例讲解
2018/10/06 Javascript
性能优化篇之Webpack构建速度优化的建议
2019/04/03 Javascript
使用vue打包进行云服务器上传的问题
2020/03/02 Javascript
vue之封装多个组件调用同一接口的案例
2020/08/11 Javascript
JavaScript大数相加相乘的实现方法实例
2020/10/18 Javascript
Ant Design Vue table中列超长显示...并加提示语的实例
2020/10/31 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
Python基于pygame实现的font游戏字体(附源码)
2015/11/11 Python
实例解析Python设计模式编程之桥接模式的运用
2016/03/02 Python
Django小白教程之Django用户注册与登录
2016/04/22 Python
完美解决python遍历删除字典里值为空的元素报错问题
2016/09/11 Python
JSON Web Tokens的实现原理
2017/04/02 Python
Python 安装setuptools和pip工具操作方法(必看)
2017/05/22 Python
使用python批量修改文件名的方法(视频合并时)
2020/03/24 Python
Python魔术方法专题
2020/06/19 Python
Python局部变量与全局变量区别原理解析
2020/07/14 Python
python regex库实例用法总结
2021/01/03 Python
如何用python开发Zeroc Ice应用
2021/01/29 Python
用HTML5的canvas实现一个炫酷时钟效果
2016/05/20 HTML / CSS
Wedgwood美国官网:英国骨瓷,精美礼品及家居装饰
2018/02/17 全球购物
英国领先的在线礼品店:Getting Personal
2019/09/24 全球购物
学期个人工作总结
2015/02/13 职场文书
少年雷锋观后感
2015/06/10 职场文书
重阳节主题班会
2015/08/17 职场文书
ubuntu安装jupyter并设置远程访问的实现
2022/03/31 Python
Docker 镜像介绍以及commit相关操作
2022/04/13 Servers