Canvas，iframe和Access-Control-Allow-Origin

Question

我對這個問題感到瘋狂，並希望有一個解決方案或解決方法。 我在iframe中有一個畫布，在不同的域中（出於安全原因）。 此畫布顯示Processing.js動畫/繪圖。 我需要允許畫布加載位於同一域中的圖像文件。

帶有iframe index.html位於domain.com中

帶有canvas index.html位於sub.domain.com中

現在我肯定知道：

1. 畫布可以加載/可視化遠程圖像，但無法訪問遠程圖像數據（像素）。
2. 畫布可以完全訪問同一域中的圖像文件，除非它在iframe（！？）中播放。
3. 設置Access-Control-Allow-Origin標頭只允許訪問其他域上的文件。
4. 畫布根本不支持/考慮Access-Control-Allow-Origin標頭。

有沒有辦法繞過所有這些安全限制，只需在iframe中播放一個畫布來加載圖像文件？

Answer 1

我找到了解決問題的方法（看到沒有人回答）。 實際上我忘了一些東西......我在iframe標簽中使用了sandbox屬性，這就是問題所在。 一旦刪除，圖像開始在畫布中，至少在Firefox和Chrome中可訪問（尚未測試IE）。 無論如何， sandbox屬性仍然具有非常糟糕的支持，並且在跨域方案中可能完全無用。

所以。 我可以確認，使用普通的iframe （沒有任何sandbox參數），當將圖像加載到iframe中的canvas ， 當且僅當圖像位於canvas頁面的同一域中時， 才會出現問題 。