Javascript can'；无法从画布获取像素数据

我正在从我的电脑在网页上加载黑白图像，然后在画布上绘制图像。然后我想检索第一个像素的颜色。下面是我正在使用的JavaScript函数：

function loadImage(){
    var c=document.getElementById("canvas");
    var ctx=c.getContext("2d");
    var img=document.getElementById("first");
    ctx.drawImage(img,0,0);
    var z1=ctx.getImageData(0, 0, 1, 1).data[0];
    document.getElementById("1").value=z1;
};

我得到以下错误：

Uncaught SecurityError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.

有什么办法可以达到我的要求吗？这是我正在进行的一个项目的一部分，我想创建一个绘制给定图片的遗传算法。该项目的一个重要部分是比较初始图像（加载到画布中）和由伪随机像素填充的画布中的像素。然后，我将小的方差引入像素，使其向初始图像方向发展

如果我手动绘制画布（使用fillRect），我可以使用“getImageData”检索像素数据。但是，当我使用图像（drawImage）绘制画布时，会出现上述错误

请帮忙

编辑：我看过：

---

但事实并非如此。我正在从自己的计算机加载图像。我只是将.html、.js和.png文件放在同一个文件夹中，然后运行.html文件。

好的，我已经安装了WAMP，将所有内容放在“www”文件夹中，然后从那里运行它。成功了。

我正要说同样的话。这里的答案解释了这个问题…我猜你是从另一个url或源加载图像？我是从自己的计算机加载图像，如下所示：我也找到了答案，但我不明白如何解决这个问题。根据我的理解，我需要将的“crossOrigin”属性设置为“Anonymous”并“在服务器上设置以下标头”：Access Control Allow Origin“*”。我无法将该属性添加到我的标记中，因为我收到以下错误：“源站图像”文件：//“已被跨源站资源共享策略阻止加载：响应无效。因此，不允许访问源代码“null”。。我不知道如何在服务器上设置标题。服务器是我自己的电脑。我运行一个HTML文件。由于您的问题与以前提出的问题重复，您可能希望删除您的答案和问题。；-）