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

   日期:2020-05-31     浏览:87    评论:0    
核心提示:首先我们来看看将会用到的小程序API:【上传】:wx.chooseMessageFile 官方API地址https://developers.weixin.qq.com/miniprog...

首先我们来看看将会用到的小程序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('打开文档成功')
          }
        })
      }
    })
  }

 

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

 

 

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
更多>相关资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服