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

Question

我使用canvas.getImageData获取HTML/jscanvas中一个像素的颜色。如果它不是一个受人尊敬的网站，它不会加载，因为跨源数据。但我无法使该网站受人尊敬，因为我想在我的设备上将其作为 HTML 文档打开，以便能够离线打开它。我将图像加载到 canvas，但是当您没有互联网时，它会加载保存在 localStorage 中的图像（作为 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

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

use app image data on not respectable websites

javascript

canvas

getimagedata