Canvas That Created From Video Raising "Tainted Canvases May Not Be Exported." Error When Saving

I'm creating snapshot from HTML5 video, using this example. Video is hosted on 3rd party servers, that I can't control. So I wanted to save image, but toDataURL failing because of

Solution 1:

crossOrigin='anonymous' is only half the solution to passing cross-domain security requirements. It causes the browser to read the response headers and not taint the canvas if the headers allow for cross-origin access of the content.

The other half of the solution is for the server to be configured to send the proper cross-origin permissions in its response headers. Without the server being configured to allow cross-origin access, the canvas will still be tainted.

The only ways to satisfy cross-origin security are:

1. Have the video originate on the same domain as your web pages.

2. Have the video server configured to send the appropriate cross-origin access in its headers.

There are no workarounds -- you must satisfy the security restrictions.