微信小程序的上传图片或者其他文件的简单小例子

最新推荐文章于 2024-08-03 10:21:01 发布

原创最新推荐文章于 2024-08-03 10:21:01 发布 · 420 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端

小程序

本文介绍了一种使用微信小程序进行文件上传的方法，详细展示了如何通过chooseMessageFile和cloud.uploadFile API选择并上传各种类型的文件到云存储，包括处理文件路径和扩展名的技巧。

<button bindtap="uploadEvent" type="primary">上传</button>
<image src="{{imgSrc}}" style="width:100%" mode="widthFix"></image>

uploadEvent(){
    // //1.选择图片，本机相册
    // wx.chooseImage({
    //   success:(res)=>{
    //     console.log(res)
    //     //res.tempFilePaths[0]
    //     //2.上传图片
    //     wx.cloud.uploadFile({
    //       cloudPath:new Date().valueOf()+'.png',
    //       filePath:res.tempFilePaths[0],
    //       success:(result)=>{
    //         console.log(result)
    //         this.setData({
    //           imgSrc:result.fileID,
    //         })
    //       }
    //     })
    //   }
    //   ,fail:(err)=>{
    //     console.log(err)
    //   }
    // })
        //4.想试一下别的文件
        wx.chooseMessageFile({
          success:(res)=>{
            console.log(res)
            //res.tempFiles[0].path
            if(res.tempFiles.length>0){
              wx.cloud.uploadFile({
                //这个地方需要加上后缀
                cloudPath:new Date().valueOf()+'.'+res.tempFiles[0].name.split('.').pop(),
                filePath:res.tempFiles[0].path,
                success:(result)=>{
                  console.log(result)
                  wx.showToast({
                    title: 'success',
                    duration:1000,
                  })
                  this.setData({
                    //imgSrc:result.fileID,
                  })
                }
                ,fail:(err)=>{
                  console.log(err)
                  wx.showToast({
                    title: 'fail',
                    duration:1000,
                  })
                }
              })
            }else{
              console.log('err:获取文件失败')
                  wx.showToast({
                    title: 'fail',
                    duration:1000,
                  })
            }

          },fail:(err)=>{
            console.log(err)
            wx.showToast({
              title: 'fail',
              duration:1000,
            })
          },
        })
  },

标签

#小程序