如果要做一個(gè)分享朋友圈，而需要通過canvas繪制圖片，在真機(jī)上是不顯示你的用戶頭像的，但是開發(fā)者工具和真機(jī)上打開調(diào)試是可以看的朝巫。這就需要在微信公眾平臺(tái)把你頭像前面的網(wǎng)址配置到downloadFile網(wǎng)址里去
比如下面的頭像，就需要把https://wx.qlogo.cn添加到downloadFile網(wǎng)址去,然后清除緩存石景，重新打開就可以看到繪制的頭像了
"avatarUrl":"https://wx.qlogo.cn/mmopen/vi_32/F8sadfIasdasdfadf"}劈猿，還有這個(gè)頭像地址需要下載到本地才能去繪制
重點(diǎn)注意
1,這就需要在微信公眾平臺(tái)把你頭像前面的網(wǎng)址配置到downloadFile網(wǎng)址里去。
2潮孽，"avatarUrl":"https://wx.qlogo.cn/mmopen/vi_32/F8sadfIasdasdfadf"}糙臼，還有這個(gè)頭像地址需要下載到本地才能去繪制
downloadFile 該方法去下載到本地。
openfun() {
let that= this;
wx.downloadFile({
url: that.data.avatarUrl,
success: function (res) {
// console.log(res.tempFilePath); //還有下載過的頭像圖片才能去繪制
that.setData({
avatarUrl:res.tempFilePath,
})
//繪圖方法
that.drawImage();
}, fail: function (fres) {
}
})
},
//繪制方法
drawImage:function() {
var that = this
const ctx = wx.createCanvasContext('sharePhoto',this)
// console.log(wx.getSystemInfoSync())
var Width = wx.getSystemInfoSync().windowWidth*0.74
var Height = wx.getSystemInfoSync().windowHeight * 0.68
var avatarUrl = that.data.avatarUrl
ctx.save();
ctx.beginPath();
ctx.arc(Width * 0.5, Height * 0.175, Width * 0.098, 0, 2 * Math.PI);
ctx.clip();//畫了圓 再剪切
ctx.drawImage(avatarUrl, Width * 0.4, Height * 0.109, Width*0.197, Height*0.132)
ctx.restore();
ctx.save();
ctx.draw();
},
