gpt4 book ai didi

javascript - 如何从 HTML 中的 MJPEG 流制作快照

转载 作者:太空狗 更新时间:2023-10-29 15:47:27 24 4
gpt4 key购买 nike

我有以下 HTML 网页:

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

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

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

最佳答案

您的流现在似乎无法正常工作,但请尝试一些 Canvas 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>

关于javascript - 如何从 HTML 中的 MJPEG 流制作快照,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5144940/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com