Solve the cross-origin problem of Canvas. toDataURL images,

Solve the cross-origin problem of Canvas. toDataURL images,

For example, when the image address of the page is output locally (Html2Canvas. js), The toDataURL access permission issue may occur due to the cross-origin issue of different image addresses:

[Redirect at origin 'HTTP: // sub1.xx.com 'has been blocked from loading by Cross-Origin Resource Sharing policy:
No 'access-Control-Allow-origin' header is present on the requested resource. origin' http: // sub2.xx.com 'is therefore not allowed Access .]
Solution:
Add"Access-Control-Allow-Origin", That is, allow access to the source file, then we will handle this page [note is to output the page image] like this:

Var img = new Image; img. onload = myLoader; img. crossOrigin ='Anonymous'; // Optional values:Anonymous, * Img. src = 'HTTP: // myurl.com /....';

Or in HTML

anonymous">

The core is that the request header contains the Origin :"Anonymous "or "*"The Access-Control-Allow-Origin: * field is appended to the response header. The problem is solved.