微信小程序上传文件（可传 word、excel、ppt、视频、图片……）

文章目录

前言

近期做技术调研时发现微信官方支持文件上传了，这里记录一下
官方 API：wx.chooseMessageFile(Object object)

交互：从微信聊天里选择文件（选一个好友/群聊，从你们聊天记录里的文件里选）

• 点红框是预览，点右上角圆圈才是选中（昨天做技术调研时点红圈部分是预览，搞得我还以为只支持图片选择）

示例代码

wx.chooseMessageFile({count:10,type:'all',success(res){// tempFilePath可以作为 img 标签的 src 属性显示图片// const tempFilePaths = res.tempFilesconst tempFilePaths = res.tempFiles[0].path
    const type = res.tempFiles[0].type
    console.log(tempFilePaths,"tempFilePaths")
    console.log(type,"type")/*
    // word excel ppt
    wxfile://tmp_1a3a5917bca43c3fa77c11df43d416df10e46c19618252e4.docx tempFilePaths
    file type
    
    wxfile://tmp_9453f576fe6bfd2b18cfdc62cb91bda439fc0e8013eb6f7701d3e8395d132018.xlsx tempFilePaths
    file type
    
    wxfile://tmp_48974d797db4b2ea7ad8db76106385989b5941c6bfdc5b5b186608263fac11b9.pptx tempFilePaths
    file type
    
    // 视频、图片
    wxfile://tmp_21c1296f0b72c8d33cae70c993d5b85d95439b4940b4c07e.mp4 tempFilePaths
    video type
    
    wxfile://tmp_611597681c099cacb86e353b0b71adcb13a65700f46e8be7.jpg tempFilePaths
    image type
    */}})

能拿到文件临时地址就能配合文件上传 API 将文件传上去了

• 参考：微信小程序如何上传word,excel文件

chooseUpload(){var that =this
    wx.chooseMessageFile({count:10,type:'file',extension:['.xlsx','.xls','.XLSX','.XLS','xlsx','xls','XLSX','XLS'],success(res){const tempFilePaths = res.tempFiles
        for(var i in tempFilePaths){
          wx.uploadFile({url:'http://xxx',//上传的服务器地址filePath: tempFilePaths[i].path,name:'file',formData:{'file': tempFilePaths[i].path
                   },header:{[wx.getStorageSync('tokenName')]: wx.getStorageSync('token'),},success:function(resp){
              console.log(resp)var data =JSON.parse(resp.data)
              console.log(data)if(data.code ==200){
                wx.showToast({title:'上传成功',icon:'none',duration:1300})}else{
                wx.showToast({title: data.message,icon:'none',duration:2000})}},fail:function(err){
              console.log(err)}})}}})},