Javascript Canvas獲取圖像像素數據

Question

我有兩個關於javascript canvas的問題：

第1部分：
我在與html文檔相同的文件中有一個.jpg。 我想知道是否有一種簡單的方法可以在該文件中獲取像素的顏色，而無需使用context.getImageData（）。

第2部分:(如果第1部分過於復雜而無法使用。）
如果我直接從這個站點復制代碼： W3學校將getImageData（）放到桌面上的html文件中，並將一個名為img_the_scream.jpg的圖像添加到我的桌面，然后運行它我收到此錯誤：

Unable to get image data from canvas because the canvas has been tainted by cross-origin data. test.html:15
Uncaught Error: SecurityError: DOM Exception 18 

我真的不知道它為什么適用於該網站，但不適合我。

Answer 1

這是同源策略所施加的限制：如果服務器明確允許使用CORS頭，則無法讀取由另一個源提供的JavaScript數據。

如果你想獲得由另一台服務器服務的圖像像素，而這個服務器沒有設置這個標頭，那么你必須使用一種代理或者通過獲取圖像服務器來處理你的服務器。側。

請注意，瀏覽器會將來自file://所有文件視為來源不同。 如果您嘗試在本地執行此操作，則必須使用http服務器。