微信小程序上传功能

1̶0̶0̶8̶

已于 2022-03-21 15:44:41 修改

阅读量1.7k

点赞数

分类专栏：小程序文章标签： vue.js javascript 前端微信小程序

于 2022-03-21 13:24:25 首次发布

本文链接：https://blog.youkuaiyun.com/qq_44897151/article/details/123632834

版权

本文讲述了在开发微信小程序视频上传功能时遇到的问题和解决方案，重点讨论了前端name参数与formData的关系，以及微信小程序上传文件的流程。前端的name参数实际上是服务端获取文件的关键信息。此外，补充了小程序多图片上传的特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

踩坑篇

最近在搞微信小程序的视频上传功能，很简单的一个问题却折腾许久，甚至反复怀疑后端功能性错误
唠一唠小程序端和PC端上传组件不一样的地方
其实之前有做过 PC端的上传功能，当时是在表单中上传一个压缩包，直接采用elementUI中的upload组件

<el-upload
  class="upload-demo"
  action="上传地址"
  :file-list="fileList">
</el-upload>

直接填一个上传地址即可，也不用约定什么上传请求头，组件一把梭
在微信小程序端上传有对应的JSAPI (wx.uploadFile)

 wx.uploadFile({
   
      url: '上传地址',
      filePath: tempFilePaths[0],
      name: 'file',//踩坑就踩在这里，后端接收到的是要写在下面formData里的参数，并且对上传文件没有做类型限制，所以约定为data,这个data里有所要上传文件的二进制文件，后端依靠解析data拿到文件字节信息
      formData: {
   
        'user': 'test'
      }

最低0.47元/天解锁文章