测试uniapp开发的微信小程序时,突然发现一个bug
流程:进入商品详情-生成商品海报分享-扫海报进入
扫第一个海报,内容与海报一致.
扫第2,3,4,5个分享图进去,内容都是第一个海报的
当时排查了很久
考虑是否参数覆盖的问题
是否后端返回base64的问题
是否生成海报时的问题
是后端返回前端转微信图片时的问题
排查到最后发现,将后端的base64转微信本地图片时,因为文件名相同
ios会直接覆盖,安卓或者鸿蒙手机会复用之前的,导致分享图2,3,4,5个扫码后显示的是1的内容.
下面是生成微信本地图片的代码:
const fsm = wx.getFileSystemManager ? wx.getFileSystemManager() : null;
const FILE_BASE_NAME = 'tmp_base64src'; //自定义文件名
export function 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}`;
console.log('filePath', filePath)
const buffer = wx.base64ToArrayBuffer(bodyData);
fsm.writeFile({
filePath,
data: buffer,
encoding: 'binary',
success() {
cb(filePath);
},
fail() {
return (new Error('ERROR_BASE64SRC_WRITE'));
},
});
};
//module.exports = base64src;
只要调用这个方法生成的微信本地图片,在安卓上相同名称都会复用第一张图,ios则会覆盖,导致bug,因此修改方案也很简单,将商品的id传入,然后加在filePath上即可
