Board logo

标题: 解决html2canvas 引用微信头像无法生成图片的解决办法 [打印本页]

作者: xiexie    时间: 2022-4-28 16:37     标题: 解决html2canvas 引用微信头像无法生成图片的解决办法

做公众号项目时,引用微信头像时,生成图片时不报错,但无法生成,查了好久,后来发现改一个参数就行。

案例:
         function download(){
var _width = $('#card_info').width(),
_height = $('#card_info').height();
 
var canvas = document.createElement("canvas");
var scale = 4; //放大倍数
canvas.width = _width * scale;
canvas.height = _height * scale;
canvas.getContext("2d").scale(scale, scale);
document.body.scrollTop = document.documentElement.scrollTop = 0;
var w = $('#card_info').outerWidth(),
h = $('#card_info').outerHeight();
html2canvas($('#card_info'),{
allowTaint: false,  //修改这里接收外部链接图片
useCORS: true,
scale: scale,
canvas: canvas,
width: _width,
heigth: _height,
dpi: window.devicePixelRatio * 96,
onrendered: function(canvas) {
document.body.appendChild(canvas);
$("canvas").hide();
$(".tips_cont").hide();
$(".content,.cont_btn").show();
convertCanvasToImage(canvas);
}
});
function convertCanvasToImage(canvas) {
var image = new Image();
image.setAttribute("crossOrigin",'Anonymous');
image.src = canvas.toDataURL();
$(".pic img").attr({"src":image.src}).css({"width":"5.77rem","height":"8.52rem"});
$(".pic").show();
$("#card_info").hide();
return image;
}
}





欢迎光临 PHP开发笔记 (http://phpvi.com/) Powered by Discuz! 6.1.0