微信小程序 wx.previewImage()（传入base64数据）

场景应用

微信小程序使用wx.previewImage()浏览图片，但是后台传过来的是base64数据。

思路

先把base64作为临时文件存到本地，然后预览，预览结束时删除临时文件

// 获取应用实例 
const app = getApp() Page({
	data: {
		//base64数据，由后台传过来     
		base64: '',
		//本机的临时文件路径     
		localImgUrl: ''
	},
	onShow: function() {
		// 在这里删除临时文件    
		var localImgUrl = this.data.localImgUrl;
		if (localImgUrl) {
			var fs = wx.getFileSystemManager();
			fs.unlinkSync(localImgUrl);
			// fs.closeSync();
		}
	},
	// 预览图片   
	onPreviewImage() {
		var base64 = "data:image/PNG;base64," + this.data.base64;
		var imgPath = wx.env.USER_DATA_PATH + '/e-invoice' + Date.parse(new Date()) + '.png';
		var imageData = base64.replace(/^data:image\/\w+;base64,/, "");
		var fs = wx.getFileSystemManager();
		fs.writeFileSync(imgPath, imageData, "base64");
		// fs.close();
		this.setData({
			localImgUrl: imgPath
		}) wx.previewImage({
			urls: [imgPath]
			// 需要预览的图片http链接列表
		})
	}
})

原地址

微信小程序预览base64图片