canvas.toDataURL() Security Error The operation is insecure

Question

When I am trying to get a screenshot and save it as PNG before uploading video to server, I am having the following problem

Answer 1

It's because of the Same Origin Policy. Basically, you're not allowed to access the video data of something loaded from another origin/site using a canvas.

Drawing video data on the canvas sets the origin-clean flag to false, which stops you from getting the image data in any way.

See toDataURL for more information.