将网络图片使用APIgetImageInfo / downloadFile下载下来,在画图时还是报错不显示
这是调用代码
/**生成分享海报 */
ajaxcanvasImg:function(img){
let that = this;
let url = img ? img :'图片的网络路径';
wx.getImageInfo({
src: url, //仅为示例,并非真实的资源
success(res) {
console.log(res)
$.canvasImg1('#canvas_poster', res.path, function (urlImg) {
console.log(urlImg)
})
}
})
},
这是封装的函数
/**画布分享链接的海报1 */
canvasImg1: function (template,img,callback){
let that = this;
const query = wx.createSelectorQuery()
query.select(template)
.fields({
node: true,
size: true
})
.exec((res) => {
const canvas = res[0].node
const ctx = canvas.getContext('2d')
const dpr = wx.getSystemInfoSync().pixelRatio
ctx.scale(dpr, dpr)
canvas.width = 442 * that.globalData.rpx
canvas.height = 336 * that.globalData.rpx
const image = canvas.createImage(); //创建image
console.log(image)
image.src = img; //指定路径为getImageInfo的文件
image.onload = () => {
ctx.drawImage(image, 0, 0, 442 * that.globalData.rpx, 264 * that.globalData.rpx) //图片加载完成时draw
}
const image2 = canvas.createImage(); //创建image
image2.src = '/images/icon/btn.png'; //指定路径为getImageInfo的文件
image2.onload = () => {
ctx.drawImage(image2, 14 * that.globalData.rpx, (264 + 8) * that.globalData.rpx, 396 * that.globalData.rpx, 56 * that.globalData.rpx) //图片加载完成时draw
}
setTimeout(function () {
wx.canvasToTempFilePath({
canvas: canvas,
success(res) {
callback(res.tempFilePath)
}
})
}, 200);
})
},
真机上显示吗?