Question

我有一个必须在本地运行的HTML5应用。当我运行应用程序并尝试在画布上加载图像时，在Chrome上我收到错误消息：

无法从画布获取图像数据，因为画布已经存在受到跨源数据的污染

HTML文档和本地文件夹中的图像a。这是一个将分发给用户的应用程序，因此我无法运行本地服务器。它必须在Chrome上按原样运行... 我已经阅读了关于这个问题的答案，但它们都与CORS和Cross-Orgin政策有关，这些政策与本地文件无关......

这种情况的解决方案是什么？如何在Chrome上本地加载图片？

编辑：这是抛出错误的代码：

var canvas = Matach.createElement(false, "canvas", false, false);           
var context = canvas.getContext("2d");
context.clearRect(0, 0, canvas.width, canvas.height);
context.globalCompositeOperation = 'source-over';

context.save();
context.drawImage(
    item.img.img, 
    -item.img.width / 2, 
    -item.img.height / 2, 
    item.img.width, 
    item.img.height
);

context.restore();

res = context.getImageData(0, 0, canvas.width, canvas.height);

Answer 1

在chrome getimagedata中存在一些安全问题，所以为了使用它你必须做一些转变，查看这些帖子以供参考，你将得到解决方案，

canvas getImageData doesn't work when running locally on Windows? (security exception)

Why does HTML Canvas getImageData() not return the exact same values that were just set?

使用Chrome在本地画布上绘制图像

1 个答案: