几种常见的上传图片的方式（微信小程序，微信公众号，普通的网页，uni-app）

原创

于 2020-07-29 16:42:06 发布

· 2.3k 阅读

3 ·

版权

文章标签：

#小程序 #js

本文探讨了在不同平台如普通网页、微信小程序和uni-app中上传图片的方法。在小程序中，由于不支持file blob格式，可以通过将图片转为base64或使用小程序的上传文件API配合formdata来实现。对于uni-app，可以借鉴类似策略。

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

普通的网页:

	<input type="file" accept="image/*" onchange="getzImg(this)" id="zm" />
	
			function getzImg(imgFile) {
				var file = imgFile.files[0];
				console.log(file)
				}
				使用formdata提交文件流就可以了

在这里插入图片描述
微信小程序（小程序不支持file blob格式）
第一种方式，获取文件路径使用小程序自带的api转换文件为base64,然后普通的接口请求上传文件

  wx.chooseImage({
      count: 1,
      sizeType: ['compressed'], //可选择原图或压缩后的图片
      sourceType: ['album', 'camera'], //可选择性开放访问相册、相机
      success: res => {
       // wx.hideLoading()
        // 限制最多只能留下2张照片
        console.log(res)
        this.setData({
          materialUpLoad1File: 'data:image/png;base64,'+wx.getFileSystemManager().readFileSync(res.tempFilePaths[0], 'base64')
        })
      }
    })
</