【微信小程序】上传、下载文件 [精华帖少走弯路系列]

首先我们来看看将会用到的小程序API：

【上传】：

1. wx.chooseMessageFile                                                                                                                                                                官方API地址https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseMessageFile.html

2. wx.uploadFile                                                                                                                                                                            官方API地址https://developers.weixin.qq.com/miniprogram/dev/api/network/upload/wx.uploadFile.html

【下载】：

1. wx.downloadFile                                                                                                                                                                       官方API地址https://developers.weixin.qq.com/miniprogram/dev/api/network/download/wx.downloadFile.html
2. wx.openDocument                                                                                                                                                                   官方API地址：https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.openDocument.html

 

正常大家的思路是这样的：

上传：从手机文件夹内，选取文件上传到服务器

下载：点击下载按钮，能够将文件下载到手机文件夹中

           奈何ios系统是闭源的，在手机上无法编辑，只能连接电脑，用电脑上的各类手机助手来打开手机里的文件夹

         （ps：你要懂得你接触的每个客户，上至老年，这个步骤肯定是对ios用户群来说是吃力的）

 

目前在各个博客平台，集思广益找到了我认为的最优方法：

【上传】：从微信聊天界面的 文件传输助手 选取需要上传的文件

主要实现代码如下：

  // 上传文件
  uploadFile: function () {
    let that = this;
    wx.chooseMessageFile({
      count: 1,
      type: 'file',
      success(res) {
        const tempFilePaths = res.tempFiles;
        console.log("临时路径：", tempFilePaths);
        wx.uploadFile({
          url: 'https://example.weixin.qq.com/upload', //仅为微信官方示例，非真实的接口地址
          filePath: tempFilePaths[0].path,
          name: 'file',
          formData: {
            'user': 'test'
          },
          success(res) {
            const data = res.data
            console.log("data", data);
            wx.showToast({
              title: '上传成功',
              icon: 'success',
              duration: 2000
            })
          }
        });
      }
    })
  },

【下载】：同理，将下载的文件预览，右上角点击转发，转发至 文件传输助手 

// 下载文件
  downFile: function () {
    let that = this;
    wx.downloadFile({
      url: 'https://lg-332ncmjq-1256907309.cos.ap-shanghai.myqcloud.com/stepking/a.xlsx',
      success: function (res) {
        var filePath = res.tempFilePath;
        console.log(res)
        wx.openDocument({
          showMenu:true,//这个参数一点要写，不然只能预览文档，不能右上角转发到聊天界面
          filePath: filePath,
          success: function (res) {
            console.log('打开文档成功')
          }
        })
      }
    })
  }

 

好啦，大致就是这样（综合某度大家的智慧得出此流程），代码小白一枚，请大神们轻喷~