在不受人尊敬的网站上使用应用图像数据

Question

我使用 canvas.getImageData 在 HTML/js 画布中获取一个像素的颜色。 如果它不是一个受人尊敬的网站，它就不会这样做，因为跨源数据。 但是我不能使网站受人尊敬，因为我想在我的设备上将其作为HTML文档打开，以便能够离线打开它。 我将图像加载到画布中，但是当您没有互联网时，它将加载保存在本地存储中的图像(作为dataURL(。 感谢您的关注 我对每一个可能有帮助的答案都感到高兴

Answer 1

有两种方法可以加载跨源图像。首先是使用fetch和 blob：

let image_url = await(await fetch(url, mode='cors')).blob();
let image = new Image;
image.url = image_url; 

另一个选项是在图像元素上设置crossOrigin=anynymous：

downloadedImg = new Image;
downloadedImg.crossOrigin = "Anonymous";
downloadedImg.addEventListener("load", imageReceived, false);
downloadedImg.src = imageURL;

见 https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image