uni-app微信小程序合成海报并保存到相册

  页面有三部分的图片。logo。二维码和背景图。其中背景图是本地的。

logo和二维码是接口给的。

像这样的海报合成的例子我写过一篇，是在vue的项目中的vue把几张图片logo。二维码。背景合成一个海报并下载，使用canvas

但是小程序里面不支持使用var img=new Image();    他会有这个文章里面的报错。

 //把网络图片改成本地图片
           getNetworkImage(url) {
                return new Promise((resolve, reject) => {
                    uni.downloadFile({
                        url,
                        success: (e) => {
                            const p = e.tempFilePath
                            if (p.indexOf('json') > -1) {
                                reject(p)
                                return false
                            }
                            resolve(p)
                        },
                        fail: (r) => {
                            reject(r)
                        }
                    })
                })
            },
            //把base64图片转为本地图片
            base64ToSave(base64data, FILE_BASE_NAME = 'tmp_base64src') {
                const fsm = uni.getFileSystemManager();
                return new Promise((resolve, reject) => {
                    //format这个跟base64数据的开头对应
                    const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
                    if (!format) {
                        reject(new Error('ERROR_BASE64SRC_PARSE'));
                    }
                    const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
                    const buffer = wx.base64ToArrayBuffer(bodyData);
                    fsm.writeFile({
                        filePath,
                        data: buffer,
                        encoding: 'binary',
                        success() {
                            resolve(filePath);
                        },
                        fail() {
                            reject(new Error('ERROR_BASE64SRC_WRITE'));
                        },
                    });
                });
            },

 我的二维码和logo都是接口传的数据。这里都转为本地的。

 genQrFile1() {
                var urlQR = this.base64ToSave(this.qrBase64);//二维码。base64转为本地图片
                var logo=this.getNetworkImage(this.userinfo.logo1);//机构logo网络图片转为本地图片
                let that = this;
                Promise.all([
                    urlQR,logo
                ]).then(res => {                    
                    that.qrUrl=res[0]                    
                    let ctx = uni.createCanvasConte