主要区别在于Rasterize是
SVG foreignObject左右的包装器,而html2canvas本质上是从头开始重新实现浏览器HTML呈现. Rasterize必须处理很多安全问题,但我认为它的方法更好,正如html2canvas 2400只有950行代码所示.
如果您渲染的HTML不是很复杂或者不需要像素完美,那么您可以跳过Rasterize并直接使用foreignObject,如MDN: Drawing DOM objects into a canvas所述:
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var data = '' +
'' +
'
'I like cheese' +
'
'' +
'';
var DOMURL = window.URL || window.webkitURL || window;
var img = new Image();
var svg = new Blob([data], {type: 'image/svg+xml;charset=utf-8'});
var url = DOMURL.createObjectURL(svg);
img.onload = function () {
ctx.drawImage(img, 0, 0);
DOMURL.revokeObjectURL(url);
}
img.src = url;