显示MJPEG流的跨浏览器解决方案

发布于 2024-10-21 13:03:33 字数 837 浏览 5 评论 0原文

有没有一种轻量级、免费且可靠的方式在跨浏览器环境中显示 MJPEG?我正在尝试显示来自 Axis 的 MJPEG 流我正在开发的网站上有 2120 IP 摄像头,我发现这在当前版本的 Firefox 中相当可靠。然而,经过一些测试,我发现 IE、Opera 和 Chrome 在执行此操作时都存在不同程度的问题(无法访问 Mac,所以我不确定 Safari)。 Internet Explorer 不支持 MJPEG,根本无法工作。在发送初始 GET 后,Opera 实际上需要 10-15 秒才能显示任何内容。 Chrome 可以正常工作,直到包含 标记的

被隐藏然后再次显示。

作为参考,我使用 标签来显示流,如下所示:

<img src="http://my.ip.addr/axis-cgi/mjpg/video.cgi/?resolution=352x240" alt="real-time video feed" />

我考虑过使用 重播服务器来收集MJPEG流并即时转码,但这个解决方案看起来太丑陋了。还有更好的建议吗?

Is there a lightweight, free, and reliable way to display MJPEG in a cross-browser environment? I'm trying to display an MJPEG stream from an Axis 2120 IP camera on a site that I'm developing, and I've found that this is quite reliable in current versions of Firefox. However, after some testing I've found that IE, Opera and Chrome all have varying degrees of trouble doing this (no Mac access, so I'm not sure about Safari). Internet Explorer has no support for MJPEG and doesn't work at all. Opera takes literally 10-15 seconds to display anything after the initial GET was sent. Chrome works perfectly until the <div> that contains the <img> tag is hidden and then shown again.

For reference, I'm using an <img> tag to display the stream like so:

<img src="http://my.ip.addr/axis-cgi/mjpg/video.cgi/?resolution=352x240" alt="real-time video feed" />

I've considered using a re-broadcasting server to collect the MJPEG stream and transcode it on-the-fly, but this solution seems too ugly. Are there any better suggestions out there?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

眼角的笑意。 2024-10-28 13:03:33

几个月前我刚刚提出了一个解决方案。它是跨平台的,不需要Flash或Java等第三方插件。

基本上,它是一个 node.js 代理,可以解析 m-jpeg 边界并以定义的时间间隔提供图像。

https://github.com/rodowi/Paparazzo.js 分叉它

I've just came out with a solution a couple of months ago. It's cross-platform, and doesn't need third-party plugins such as Flash or Java.

Basically, it's a node.js proxy which parses m-jpeg boundaries and delivers images in a defined interval.

Fork it at https://github.com/rodowi/Paparazzo.js

舟遥客 2024-10-28 13:03:33

这是一个基于 Java 小程序的解决方案,您可以将其用于任何浏览器(或仅不支持 MJPEG 的浏览器): http://www.charliemouse.com/code/cambozola/

至于 MJPEG 的其他错误,我发现您应该将 'img' 标签的 'src' 属性设置为某个值除了 MJPEG 之外,在尝试删除“img”标签之前。示例:

<img src="#" />

如果您不这样做,Firefox 将继续下载 MJPEG 流,尽管它不应该这样做。

Here is a Java applet based solution that you can use for any browser (or just the ones that don't support MJPEG): http://www.charliemouse.com/code/cambozola/

As far as other bugs go with MJPEG, I have found that you should set the 'src' attribute of the 'img' tag to something besides the MJPEG before you try to remove 'img' tag. Example:

<img src="#" />

If you don't do that, Firefox will continue to download MJPEG stream even though it shouldn't.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文