微信小程序图片压缩及base64化上传

最新推荐文章于 2024-06-03 16:17:34 发布

奋斗8骚年

最新推荐文章于 2024-06-03 16:17:34 发布

阅读量7.4k

点赞数

分类专栏： html5

本文链接：https://blog.csdn.net/jslt_6666/article/details/82900299

版权

本文介绍了微信小程序中如何实现图片压缩并转换为base64格式上传。针对iOS平台可能出现的图片颠倒问题，提出了一种判断和修复方法，包括使用wx.canvasGetImageData、UPNG库以及自定义的canvas检测方案，确保在不同平台上的正确性。

摘要由CSDN通过智能技术生成

微信小程序原生提供了图片原图上传和压缩上传的办法，示例如下：

<view class="section">
    <button size="mini" bindtap="uploadImage">Upload Image</button>
</view>
Page({
  data: {
    imgUrl: '',
  },
  uploadImage: function (e) {
    var _this = this;
    wx.chooseImage({
      count: 1, // 可选择图片的数量，默认为9，当前为1
      sizeType: ['original', 'compressed'], // 可以指定是原图上传还是压缩图上传，默认二者都有，假如删掉'original'则只有压缩上传。
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
      success: function (res) {
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
        var tempFilePaths = res.tempFilePaths;
        _this.setData({
          imgUrl: tempFilePaths[0]
        }) //将生成的图片url保存下来，后面继续处理
      }
    })
  },
})