微信浏览器保存canvas海报

由于不是在微信小程序公众号内，所以uniapp或者wx提供的保存图片的方法都是失效的。如果简单的通过预览图片的方式来保存图片会有很多bug。例如：uniapp自带的预览图片功能对于ios高版本有适配问题，安卓无法保存blob格式的图片。解决办法就是把canvas转成base64格式，并且传入新页面生成图片，长按图片保存，如果图片尺寸过大，会导致安卓手机内存崩溃保存失败闪退等问题。需要注意。

          uni.canvasToTempFilePath({ //canvas转base64
            width: this.pageWidth * 0.672,//自定义生成图片的宽高
            height: this.pageWidth * 1.259,//自定义生成图片的宽高
            canvasId: "firstCanvas",
            success: function (res) {
              console.log(res.tempFilePath);
              uni.showLoading({
                title: "正在转换...",
              });
              setTimeout(()=>{
              uni.hideLoading();
              //跳转新页面 参数为encodeURIComponent的base64格式
              uni.navigateTo({
                url: `/pages/poster/saveImg?image=${encodeURIComponent(res.tempFilePath)}`
               });
              },1000)
            },
            fail: function (res) {
              uni.showToast({
                title: "保存失败",
                icon: "none",
              });
              console.log(res);
            },
          });

下一个页面接收后的代码如下 仅需长按图片保存即可

  <img :src="decodeURIComponent(this.$route.query.image)" alt=""  class="saveimg">