[图片]

因为微信原生压缩感觉左右不大，所以采用canvas画布压缩 页面 [图片] 然后wx.chooseImage---> 显示调用选择照片的接口 [图片] wx.getImageInfo--->然后获取照片原来的宽高，进行一个压缩，这里可能跟平时的h5 canvas用法不太一样 [图片] wx.canvasToTempFilePath--->最后就是调用wx.canvasToTempFilePath，将画布的图片转成微信盒子返回的临时路径 [图片] 最后就是上传图片 [图片] 上传一个图片试试 [图片] 上传成功5M变成156Kb，而且照片相对比例，质量都挺好 [图片] 然后我就多试了几次，突然出现黑色莫名图片，我心里就是纳尼？ [图片] 后面统一发现都是安卓的照片 [图片] 网上咨询了，发现都是安卓导致的，说啥的都有，说什么不适配，安卓背景色是黑色，ios是透明，然后我去试了填充背景色什么的， 我突然想到一个问题，canvas绘制需要时间，而我看了一下我上传的安卓图片大小是14M，我就想是不是延时时间给的不够 [图片] 我就把时间给成2秒 [图片] 然后就渲染出来了 [图片] 压缩比例也合适 [图片] 这个setTimeout建议改成回调

[图片] 然后我看了几个博客说需要暴露方法[图片] 但是我是js三方包，我这样暴露不知道要有多少个fun

要实现一个拍照过程中，断网重连还可以看到之前拍的照片 我这里做了一个简单demo 页面 <view class="container">   <view class='img_body'>     <view class='img_list'>       <view class='img_li' wx:for="{{imglist}}" wx:key="{{index}}">         <image src="{{item}}"></image>       </view>       <view class='addimg' bindtap='img_w_show'>         <image src='../../img/add.png'></image>       </view>     </view>   </view>   <button bindtap="toStorage">存储</button> <button bindtap="tolook">查看 <view class='img_li' wx:for="{{newList}}" wx:key="{{index}}">         <image src="{{item}}"></image>       </view>       </button>   <view>{{}} </view> </view> js var list=[]; var list2=[]; Page({   data: {     imglist:[],     newList:[],   },  img_w_show() {     var _this = this;     wx.chooseImage({       count: 9, // 默认9       sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有       sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有       success: function (res) {         // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片         var tempFilePaths = res.tempFilePaths;         list = _this.data.imglist.concat(tempFilePaths);         console.log("111111"+tempFilePaths)         console.log(list[0]);         _this.setData({           imglist: _this.data.imglist.concat(tempFilePaths)         })       }     })   },   toStorage() {     // 获取用户数据存到本地     const appInstance = getApp()     console.log(list[0]);//打印用户信息     list2=list;     list=[];     try {       wx.setStorageSync('imglist', list2[0]);       wx.getStorage({         key: 'imglist',         success: function(res) {           console.log(res.data);         },       })       //弹框提示       wx.showToast({         title: '存储本地缓存数据成功',         icon: 'none',         duration: 2000       });     } catch (e) {       //弹框提示       wx.showToast({         title: '存储本地缓存数据失败，请检查相关配置，是否联网等',         icon: 'none',         duration: 2000       });     }   },   tolook(){     var _this = this;     _this.setData({       newList: list2     }),     list2=[];   } }) 操作如下图[图片] [图片] [图片] [图片] [图片] [图片] [图片] 这里的主要思想就是调用微信图片接口wx.chooseImage返回的url， 点击存储。就放在wx.setStorageSync里面，然后进行页面渲染， 但是我console出的url是个http://tmp/wxfb0ad0f51a836ae1.o6zAJs7t7QmyBKCtv7q9mCnkl77Y.jJ5Lj639Ka7gf04604f9827156ce9b8509eaec36ac00.png这种形式的不应该是网络http协议吗，也不是base64编码 为什么断网情况我的图片还能查看出来