微信小程序 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和函数式语言的三特性
Mar 05 Javascript
Node.js(安装,启动,测试)
Jun 09 Javascript
JavaScript 异常处理 详解
Feb 06 Javascript
使用struts2+Ajax+jquery验证用户名是否已被注册
Mar 22 Javascript
深入解析桶排序算法及Node.js上JavaScript的代码实现
Jul 06 Javascript
javascript中sort排序实例详解
Jul 24 Javascript
jquery easyui dataGrid动态改变排序字段名的方法
Mar 02 Javascript
利用Jasmine对Angular进行单元测试的方法详解
Jun 12 Javascript
详解webpack-dev-server使用方法
Sep 14 Javascript
详解vue 数组和对象渲染问题
Sep 21 Javascript
如何用JavaScript实现功能齐全的单链表详解
Feb 11 Javascript
jQuery实现计算器功能
Oct 19 jQuery
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
如何让搜索引擎抓取AJAX内容解决方案
2014/08/25 PHP
phpMyAdmin安装并配置允许空密码登录
2015/07/04 PHP
反射调用private方法实践(php、java)
2015/12/21 PHP
PHP 多进程与信号中断实现多任务常驻内存管理实例方法
2019/10/04 PHP
Dom加载让图片加载完再执行的脚本代码
2008/05/15 Javascript
checkbox 复选框不能为空
2009/07/11 Javascript
fireworks菜单生成器mm_menu.js在 IE 7.0 显示问题的解决方法
2009/10/20 Javascript
JavaScript构造函数详解
2015/12/27 Javascript
javascript移动开发中touch触摸事件详解
2016/03/18 Javascript
vue.js框架实现表单排序和分页效果
2017/08/09 Javascript
JavaScript实现微信号随机切换代码
2018/03/09 Javascript
JavaScript中的事件与异常捕获详析
2019/02/24 Javascript
分享一款超好用的JavaScript 打包压缩工具
2020/04/26 Javascript
详细分析Node.js 模块系统
2020/06/28 Javascript
Javascript前端下载后台传来的文件流代码实例
2020/08/18 Javascript
[31:01]2014 DOTA2国际邀请赛中国区预选赛5.21 CNB VS Orenda
2014/05/23 DOTA
[07:03]显微镜下的DOTA2第九期——430圣堂刺客杀戮秀
2014/06/20 DOTA
[03:48]大碗DOTA
2019/07/25 DOTA
Windows下PyMongo下载及安装教程
2015/04/27 Python
Python实现合并字典的方法
2015/07/07 Python
Django视图之ORM数据库查询操作API的实例
2017/10/27 Python
利用信号如何监控Django模型对象字段值的变化详解
2017/11/27 Python
Win10下python3.5和python2.7环境变量配置教程
2018/09/18 Python
python爬虫 爬取58同城上所有城市的租房信息详解
2019/07/30 Python
Flask框架单例模式实现方法详解
2019/07/31 Python
Python 函数绘图及函数图像微分与积分
2019/11/20 Python
解决jupyter notebook 出现In[*]的问题
2020/04/13 Python
Python selenium使用autoIT上传附件过程详解
2020/05/26 Python
Python爬虫教程知识点总结
2020/10/19 Python
基于python实现百度语音识别和图灵对话
2020/11/02 Python
CSS3教程:边框属性border的极致应用
2009/04/02 HTML / CSS
经典的班主任推荐信
2013/10/28 职场文书
工程负责人任命书
2014/06/06 职场文书
实习生矿工检讨书
2014/10/13 职场文书
Go各时间字符串使用解析
2021/04/02 Golang
python中如何对多变量连续赋值
2021/06/03 Python