初始化wx jssdk
H5页面:引用和config配置
var jsconfig = Config.jsconfig
require(['../harvey/jweixin-1.6.0'], function (wx) {
wx.config({
debug: false,
appId: jsconfig.appId,
timestamp: jsconfig.timestamp,
nonceStr: jsconfig.nonceStr,
signature: jsconfig.signature,
jsApiList: []
});
window.wx = wx
})
H5页面:通过接口上报给小程序
download(elId) {
var that = this
require(['../harvey/html2canvas1.4.1.min'], function (html2canvas) {
html2canvas(document.getElementById(elId), {
useCORS: true,
}).then(function (canvas) {
var image = canvas.toDataURL("image/jpeg");
window.wx.miniProgram.postMessage({
data: {
methods:'download_image',
imageData: image,
}
})
window.wx.miniProgram.navigateBack({ delta: 1 })
});
})
},
小程序端处理
接收图片数据
<view><web-view :src="webviewPath" @message="getMessage"></web-view></view>
getMessage(e) {
let data = e.detail.data[0]
if(data.methods=="download_image"){
this.saveImg(data.imageData)
}
},
下载图片
saveImg(img) {
var _this = this;
uni.showLoading({
title: '正在下载中...'
});
wx.getFileSystemManager().writeFile({
filePath: wx.env.USER_DATA_PATH + '/member_cert.png',
data: img.slice(22),
encoding: 'base64',
success: res => {
wx.saveImageToPhotosAlbum({
filePath: wx.env.USER_DATA_PATH + '/member_cert.png',
success: res => {
uni.hideLoading();
setTimeout(function() {
uni.showToast({
title: '下载成功,请到相册查看',
duration: 2000,
icon: 'none'
});
}, 1000)
},
fail: error => {
console.log(error)
wx.showToast({
title: '服务正忙'
})
}
})
},
fail: error => {
console.log(error)
wx.showToast({
title: '服务正忙'
})
}
})
}