显示MJPEG流的跨浏览器解决方案 [英] Cross-browser solution for displaying MJPEG stream

问题描述

是否有一种轻量、免费且可靠的方式在跨浏览器环境中显示 MJPEG?我正在尝试从 收集MJPEG流并即时转码，但这个解决方案似乎太丑了.有没有更好的建议?

解决方案

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

就 MJPEG 的其他错误而言，我发现在尝试删除 'img' 标签之前，您应该将 'img' 标签的 'src' 属性设置为 MJPEG 之外的其他内容.示例:

如果您不这样做，Firefox 将继续下载 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?

解决方案

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.

这篇关于显示MJPEG流的跨浏览器解决方案的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！