Solution to the problem that html2canvas mobile terminal pictures do not display

The pictures on the CDN used are cross-domain, and the PC can be displayed normally by setting  {allowTaint: true, useCORS: true }  . But the mobile terminal H5 screenshot cannot display the picture normally. The official website says to use a proxy, but does not want to involve the back end.

I found a lot of articles and the solutions mentioned in the article were not working well, and finally I found one that got the point. Original address

The original text is relatively long, the problem I encountered is that the image cross-domain, briefly summarize the solution

1. First set useCORS: true , no need for allowTaint: true

2. Set the crossorigin="anonymous" attribute on the img tag

3. Clear the browser cache or put a pseudo version number after the url of img, like this

<img
   class="qrcode-img"
   src="http://h0.hucdn.com/open/201819/9404b56f97e7df8a_750x1334.png?any_string_is_ok"
   alt=""
   crossorigin="anonymous"
 />

 

Guess you like

Origin blog.csdn.net/promiseCao/article/details/109312803