原创

解决微信小程序无法下载非指定域名文件的方案

温馨提示:
本文最后更新于 2018年03月01日,已超过 2,264 天没有更新。若文章内的图片失效(无法正常加载),请留言反馈或直接联系我

解决微信小程序中通过downloadFile无法下载非指定服务器域名下的文件的方案!

最近遇到这个问题挺揪心的。我的小程序中的文件都是放在七牛上的,我想通过小程序下载图片后保存到手机相册

wx.downloadFile({
    url: that.data.qiniuHostUrl + that.data.wxQrcodePath,
    success: function (res) {
         if (res.statusCode === 200) {
              wx.saveImageToPhotosAlbum({
                  filePath: res.tempFilePath,
                  success: function (res) {
                      app.showSuccess('二维码保存成功,快去分享给用户扫一扫参与投票吧!');
                  },
                  fail: function () {
                      app.showError('二维码保存失败,您还可以尝试截屏后进行分享哦!');
                  }
              })
          }
    },
    fail: function (res) {
          console.log(res);
          app.showError('图片资源加载失败,您还可以尝试截屏后进行分享哦!');
    }
});

在开发阶段测试是没问题的,但是一旦上线后,程序一直走fail回调。查了一下API,发现原因也比较简单:

1. 服务器域名配置
每个微信小程序需要事先设置一个通讯域名,小程序可以跟指定的域名与进行网络通信。包括普通 HTTPS 请求(request)、上传文件(uploadFile)、下载文件(downloadFile) 和 WebSocket 通信(connectSocket

(以上摘自微信小程序说明API

也就是腾讯限制了你的请求路径,因此要想解决这个问题,只能通过其他方法:nginx

可以通过nginx反向代理,主要配置如下

location ^~ /vote/ {
		proxy_pass  http://七牛云的临时域名/vote/;
		proxy_set_header Host 七牛云的临时域名;# 注意此处,一定要将host设置为“七牛云的临时域名		proxy_set_header X-Real-IP $remote_addr;
		proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
		proxy_redirect     off;
}

此段配置的目的就是将小程序中已经配置好的可用的域名的请求代理到七牛云上,

最终的请求(https://可用的域名/vote/xxx.png)会被代理到如下路径:http://七牛云的临时域名/vote/xxx.png

此时再次进行downloadFile操作就好了!

正文到此结束
本文目录