使用 Canvas 画图,并保存至相册的过程,以下是踩过的坑:
- canvas 标签不可以设置为 display: none;若不想显示到页面,可以采用 fixed 布局视觉隐藏;
- context.draw(boolean reserve, function callback) 是异步的,wx.canvasToTempFilePath 一定要写在回调里,否则会出现无法绘图的情况;
- wx.canvasToTempFilePath 保存图片至相册,需要用户授权,所以保存前需要检查权限。一旦用户一次拒绝授权,第二次保存时是不会有授权弹窗的,可以使用 wx.openSetting 去引导用户授权。(插一句:支付宝小程序,只要没权限,每次调用都会弹出授权弹窗)
代码片段:一个简单的 canvas demo
再放个采坑过程:关于 HTML → Canvas → Image → 保存相册 的过程。点我跳转。(过程相同)