微信小程序wxml-to-canvas 二维码分享pc端报错：image load error Error: readFileSync:fail the value of “position“ is

image load error Error: readFileSync:fail the value of "position" is out of range

用到了wxml-to-canvas生成画报，画报里有二维码。模拟器和手机上都可以正常显示，pc端小程序会报这个错，导致画报中的二维码和二维码以下的区域都显示不了。

排查了一下，确定就是二维码src的原因。我项目中的二维码路径是根据接口返回前端自己生成的base64路径。参考了这篇文章小程序利用wxml-to-canvas生成分享海报的记录wxml-to-canvas是微信封装的canvas组件能跳过麻 - 掘金

其中提到base64转内存地址 否则不能在wxml模板渲染中显示图片于是按照方法转了一下，就成功了

1.用到的js：

base64src.js

const fsm = wx.getFileSystemManager();
const FILE_BASE_NAME = 'tmp_base64src'; //自定义文件名
export const base64src = (base64data, cb) =>  {
  const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
  if (!format) {
    return (new Error('ERROR_BASE64SRC_PARSE'));
  }
  const filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.${format}`;
  const buffer = wx.base64ToArrayBuffer(bodyData);
  
	

	return new Promise((resolve, reject) => {

    fsm.writeFile({
			filePath,
			data: buffer,
			encoding: 'binary',
			success() {
				cb(filePath);
				resolve(cb(filePath))
			},
			fail() {
			//	return (new Error('ERROR_BASE64SRC_WRITE'));
				reject(new Error('ERROR_BASE64SRC_WRITE'))
			},
		});
	})
}

2.使用的方式：

引用base64src.js之后这样使用

    //erweima是base64url  
    let src = await base64src(erweima, res => {
      console.log(res)
      return res // 返回图片地址，直接赋值到image标签即可
    });