getImageData 本地映像出错

Question

我使用下一个代码试图从图像中获取像素颜色

$(document).ready(function(){
         var img = document.getElementById('my-image');
         var canvas = document.createElement('canvas');
         canvas.width = img.width;
         canvas.height = img.height;
         canvas.getContext('2d').drawImage(img, 0, 0, img.width, img.height);
         var pixelData = canvas.getContext('2d').getImageData(1, 1, 1, 1).data;
      });

我每次都收到此错误：

index.html:20 Uncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.
    at HTMLDocument.<anonymous> (file:///C:/Users/ariadna/Desktop/Programacion/Test/public/index.html:20:50)
    at j (http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js:2:27295)
    at Object.fireWith [as resolveWith] (http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js:2:28108)
    at Function.ready (http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js:2:29942)
    at HTMLDocument.J (http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js:2:30308)

我看到很多关于这个问题的问题，almos 所有答案都是="您无法从另一个域获取图像，这是安全措施"。

好的，但是为什么我的不起作用，图像与.html位于同一目录中

Answer 1

问题是您正在使用本地文件file:///C:/User...您需要设置一个域(它可以是本地主机(