解决将网络图片转成base64格式报跨域的问题

Posted 2023-02-24

参考技术A 此前开发了一个前端生成海报的功能。但是由于海报的图片是网络路径的图片。所以在生成海报前需要把网络图片转成base64格式。
但是在转的途中。。发现，报跨域了。。。然后百度了一大堆看似靠谱的方法。

本来以为行了。然后打开控制台一看。canvas在转base64的时候跨域了。

Uncaught DOMException: Failed to execute 'toDataURL' on 'htmlCanvasElement': Tainted canvases may not be exported

百度了一下说给图片添加一个crossOrigin='Anonymous'就可以解决跨域。

但是加上后发现依旧是跨域。这下就头疼了。

后面偶然一次瞎操作，把crossOrigin='Anonymous'给提到了赋值src的前面。
也就是

结果竟然成功了。。。。。

附：如果服务端没有给图片设置请求头里的Access-C...A...O...字段的值为*或者你当前的域名。就算前端搞了这个跨域的玩意儿上去，依旧是拿不到图片的。