canvas.toDataURL另類？

Question

我試圖將HTML5畫布的內容轉換爲PNG圖像。

問題是畫布包含的圖像不是本地託管的，因此我得到安全錯誤。

我沒有選擇在本地託管圖像，是否有任何其他方式來捕獲畫布元素內的內容？

謝謝！

Answer 1

如果你不反對使用jQuery這個插件我做的伎倆。

http://www.maxnov.com/getimagedata/

Answer 2

想有沒有辦法解決，關於客戶端，否則這將是阻止toDataURL反正正確的呢？

也許你可以有一個服務器端腳本轉發外部圖像到客戶端，所以瀏覽器不會知道它來自另一個域。 （不需要，因爲你不能使用瀏覽器的憑據從服務器端）

只要發送圖像url作爲get參數，有內容類型標頭修改根據圖像文件，當然，並將所有這些髒字節分散在響應內容中，比如'他們應該得到的。

Answer 3

除非你可以讓你的圖像資源CORS友好，那麼沒有。

https://developer.mozilla.org/en-US/docs/CORS_Enabled_Image#What_is_a_.22tainted.22_canvas.3F

雖然你可以在你的畫布使用無CORS批准圖像， 這麼做玷污畫布。一旦畫布受到污染，您就不能再將數據從畫布中拉出。例如，你可以不用 更長的畫布來使用Blob（），toDataURL（）或getImageData（） 方法;這樣做會導致安全錯誤。

編輯：當然，如果您不僅限於純HTML5方法，還可以使用一些Flash/Crossdomain.xml技巧，但仍然假設您可以控制服務於圖像的服務器。