html2canvas苹果不显示图片,简单记录 html2canvas网页中的图片没法显示的问题

html2canvas绘制图片，若是页面中存在img，出现绘制的结果无图片时，缘由以下：(建议逐步查找)css

1.绘制时间过早，图片还没有加载html

解决方式：经过setTimeout延迟绘制或者经过img.onload监听图片是否绘制完成ios

2.绘制的图片跨域问题canvas

解决方式：图片生成前，添加 image.crossOrigin = "*";跨域

切记：要在图片赋值以前添加缓存

3.若是出现安卓或者pc端正常显示，ios端没法显示的问题app

解决方式： 处理图片跨域时，防止的位置不正确，正确方式以下dom

var image = new Image();

image.crossOrigin = "*"; // 必须在image以前赋值

image.src = src + '?v=' + Math.random(); // 处理缓存

4.页面的部分img，绘制后在ios上无显示(亲测多为jpeg图片)spa

解决方式： 将图片转化为base64格式便可。code

function getBase64Image(img) {

var canvas = document.createElement("canvas");

canvas.width = img.width;

canvas.height = img.height;

var ctx = canvas.getContext("2d");<