微信小程序 wx.uploadFile無法上傳解決辦法

更新時間：2016年12月14日 14:53:26 投稿：lqh

這篇文章主要介紹了微信小程序 wx.uploadFile無法上傳解決辦法的相關(guān)資料,需要的朋友可以參考下

微信小程序 wx.uploadFile無法上傳解決辦法

微信安卓客戶端無法使用wx.uploadFile上傳文件的問題有不少開發(fā)者都遇到。

我也因為一直不能解決，硬著頭皮提交審核最后被拒（抱著審核者最好用iOS檢測的心態(tài)，不巧審核我應(yīng)用的用的是安卓），才嘗試使用第三方的手段解決。

最終我是用了七牛第三方存儲的方式，將文件直接上傳至七牛的儲存的空間上再回調(diào)使用。

當(dāng)然像又拍云，萬象優(yōu)圖這些第三方存儲源都可以采用這種思路。

首先是將七牛的https上傳域名放進小程序的域名名單中。

這里我使用的是七牛華東區(qū)的域名https://up.qbox.me。

微信小程序wx.uploadFile采用的是multipart/form-data方式上傳，即表單上傳。

根據(jù)七牛的官方文檔說明 http://developer.qiniu.com/docs/ ... up/form-upload.html

主要需要的就是file（文件本身）和token（上傳憑證）。

然后在服務(wù)端部署獲取上傳憑證的業(yè)務(wù)代碼，通過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，賦值給已經(jīng)有的token屬性。這里只是示例，具體根據(jù)需求可自行設(shè)定。

    },

    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//這里是為文件設(shè)置上傳后的文件名

   },

   success: function(r){

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

    if(typeof data==='string')data = JSON.parse(data.trim());//解壓縮

    if(data.key){

     ... //這里就可以直接使用data.key，文件已經(jīng)上傳成功可以使用了。如果是圖片也可以直接通過image調(diào)用。

    }

   },

   fail:function (res) {

    console.log(res)

   }

  })

最終采用這種方式解決了安卓無法上傳文件的問題，當(dāng)然上傳自身服務(wù)器的問題還是有待解決。

不過對于急需解決方案的開發(fā)者還是提供了一個可行的方案。

現(xiàn)在利用第三方圖源或存儲源是一個普遍的方案，很多存儲源例如七牛，又拍云，萬象優(yōu)圖都提供了免費的空間供開發(fā)者使用。

建議大家也多做這方面的架構(gòu)和嘗試。

感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！

您可能感興趣的文章: