Canvas errors & CORS All In One
Uncaught (in promise) DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement':
Tainted canvases may not be exported
.
solution
<img crossorigin="anonymous" data-src="" src="" />
demos
https://renmingliang.github.io/vue-lottery/#/lottery
https://github.com/renmingliang/vue-lottery
(🐞 反爬蟲測試!打擊盜版⚠️)如果你看到這個信息, 說明這是一篇剽竊的文章,請訪問 https://www.cnblogs.com/xgqfrms/ 查看原創文章!
Allowing cross-origin
use of images
and canvas
HTML
provides a crossorigin
attribute for images
that, in combination with an appropriate CORS
header, allows images defined by the <img>
element that are loaded from foreign origin
s to be used in a <canvas>
as if they had been loaded from the current origin
.
HTML
爲圖像
提供了 crossorigin
屬性,該屬性與適當的 CORS
標頭相結合,允許從外部源
加載的 <img>
元素定義的圖像在 <canvas>
中使用,就好像它們是從當前源
加載的一樣 。
https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image
refs
https://stackoverflow.com/questions/22710627/tainted-canvases-may-not-be-exported
https://github.com/niklasvh/html2canvas/issues/1614
https://github.com/fabricjs/fabric.js/issues/5046
©xgqfrms 2012-2021
www.cnblogs.com/xgqfrms 發佈文章使用:只允許註冊用戶纔可以訪問!
原創文章,版權所有©️xgqfrms, 禁止轉載 🈲️,侵權必究⚠️!