1.情景展示
當使用canvas 將圖片轉為base64報錯信息如下:
Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported
2.解決方案
第一種情況:本地測試&圖片引自本地
通過file協議打開的html文件進行的本地測試
解決方案:放在服務器上就可以正常轉換了!
第二種情況:被轉換的圖片,引自網絡或者服務器
解決方案:
第一步:被引的圖片需添加屬性"crossOrigin",值為"Anonymous"。
第二步:存放圖片地址的服務器也要開啟跨域允許權限。
不然會報錯:No 'Access-Control-Allow-Origin' header is present on the requested resource.
如Apache設置:
打開LoadModule headers_module modules/mod_headers.so
在虛擬主機<Directory></Directory>內加上 Header set Access-Control-Allow-Origin *