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

Hi i have the same problem, in a system where i show videos, my users have to create a thumb when they select a video, but then Security Error.

This solution only works if you can modify the server, then you can send the video or font or etc with CORS. So you have to edit httpd.conf( Apache configuration from the server where you pull the videos).

    
        
            SetEnvIf Origin ":" IS_CORS
            Header set Access-Control-Allow-Origin "*" env=IS_CORS
        
    

and in your webpage or app, to the video tag add: crossOrigin="Anonymous"

This is a fragment of my code, after that all works again..

document.getElementById('video_thumb').innerHTML =
             '';       

With this, canvas.toDataURL() don't trow error