Useing javascript capture video picture

Question

I want capture video picture,and write some code like this

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
    $("#capture").click(function(){
        var canvas = document.createElement("canvas");
        canvas.width = $("#video").width();
        canvas.height = $("#video").height();
        canvas.getContext('2d').drawImage($("#video").get(0), 0, 0, canvas.width, canvas.height);
        var img = document.createElement("img");
        img.src = canvas.toDataURL();
        $("#output").prepend(img);
    })
}); 
</script> 

</head>
<body>
<video id="video" controls="controls">  
  <source src="test.mp4" />  
</video>  
<button id="capture">Capture</button>  
<div id="output"></div>
</body>
</html>

But it always have the error: Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

I try to output the canvas, it works.But it can't work by canvas.toDataURL(); How do I get image?Thanks.

Did you try looking up what your error means? – Etheryte Sep 12 '15 at 17:37 — Etheryte, Sep 12 '15 at 17:37
http://stackoverflow.com/a/2390361/1519836 – GottZ Sep 12 '15 at 17:39 — GottZ, Sep 12 '15 at 17:39
I understand! Very thank you for your answer – yuch chan Sep 13 '15 at 02:39 — yuch chan, Sep 13 '15 at 02:39

Useing javascript capture video picture

0 Answers0