javascript – 如何从HTML中的MJPEG流创建快照

我有以下HTML网页:

<html>
<body>
<IMG SRC='http://85.46.64.155/axis-cgi/mjpg/video.cgi'>
</body>
</html>

此网页显示IP摄像机流MJPEG数据的馈送.你可以在这里尝试上面的代码:http://jsfiddle.net/jU4aq/(它不适用于IE)

我的问题是如何制作该Feed的快照.基本上我想添加一个按钮,当用户点击它时,会弹出一个对话框,提供保存图像的选项.

最佳答案:

你的流现在似乎没有工作,但尝试一些画布javascript,如:

<html>
<body>
<IMG id="myImage" SRC='http://85.46.64.155/axis-cgi/mjpg/video.cgi'>

<input type="button" id="save" value="Save to PNG"> 

<script type="text/javascript">
document.getElementById('save').onclick = function () {

var c = document.createElement('canvas');
var img = document.getElementById('myImage');
c.width = img.width;
c.height = img.height;
var ctx = c.getContext('2d');


ctx.drawImage(img, 0, 0);
//window.location = c.toDataURL('image/png');
window.open(c.toDataURL('image/png'))
};

</script>

</body>
</html>
上一篇:java – RTSP mjpeg流播放器 – 最简单的方法吗?


下一篇:C#实现MJPEG服务器