浏览器web播放rtsp视频流解决方案(chrome/IE/firefox/360等)



代码中的具体参数含义,大家可以移步这里:

https://wiki.videolan.org/Documentation:WebPlugin/


找半天,HTML5的可以支持RTMP 但是无法播放RTSP,flash也止步于RTMP,最后同事推荐了个开源的好东东 VLC ,请教谷歌大神之后,这货果然可以用来让各浏览器(IE activex方式,谷歌、FF)实现播放RTSP视频流,那真是极好的~~ 废话不多说了附上参考文档和案例,大家自己看吧。

视频是用的海康网络摄像头(支持RTSP,标准H.264 RTP封装的设备),可以通过 rtsp://admin:12345@192.0.0.64:81/h264/ch1/main/av_stream  对摄像头进行读取RSTP流。在谷歌浏览器下实现web显示实时监控画面步骤:

1. 下载vlc -  http://www.videolan.org/vlc/  开源的好东西,并安装(本人测试系统为WIN8.1 64bit 下载32bit的就可以,XP也没问题);

2. 安装,并勾选Mozila支持;

3. 实时播放代码如下

复制代码
<object type='application/x-vlc-plugin' pluginspage="http://www.videolan.org/" id='vlc' events='false' width="720" height="410">
    <param name='mrl' value='rtsp://admin:12345@192.168.10.235:554/h264/ch1/main/av_stream' />
    <param name='volume' value='50' />
    <param name='autoplay' value='true' />
    <param name='loop' value='false' />
    <param name='fullscreen' value='false' />
    <param name='controls' value='false' />
</object>
复制代码

代码中的具体参数含义,大家可以移步这里:

https://wiki.videolan.org/Documentation:WebPlugin/

说明文档很详细,可以使用JS进行各种操作,修改视频地址、建立播放列表、暂停、播放、音量控制等。



















  • 3
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 9
    评论
要在Java后台中获取RTSP视频流,可以使用JavaCV这个开源库。它提供了一个名为FFmpeg的Java接口,可以让你直接在Java中使用FFmpeg的功能。 以下是获取RTSP视频流的示例代码: ```java import org.bytedeco.javacv.*; import javax.swing.*; public class RTSPTest { public static void main(String[] args) throws Exception { String rtspUrl = "rtsp://example.com/stream.mp4"; // RTSP流地址 FFmpegFrameGrabber grabber = new FFmpegFrameGrabber(rtspUrl); grabber.start(); CanvasFrame canvas = new CanvasFrame("RTSP Stream"); // 创建一个窗口用于显示视频流 canvas.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); while (true) { Frame frame = grabber.grab(); if (frame == null) { break; } canvas.showImage(frame); } grabber.stop(); canvas.dispose(); } } ``` 这个代码片段使用JavaCV的FFmpegFrameGrabber类从RTSP地址获取视频流,并将每一帧显示到一个Swing窗口上。 如果你想在浏览器中无插件播放RTSP视频流,可以使用WebRTC技术。WebRTC是一种基于Web的实时通信技术,它可以让你在浏览器中直接播放RTSP视频流,而不需要使用任何插件。 以下是使用WebRTC播放RTSP视频流的示例代码: ```html <!DOCTYPE html> <html> <head> <title>RTSP Stream</title> </head> <body> <video id="video" autoplay></video> <script> const video = document.getElementById('video'); const stream = new MediaStream(); // RTSP地址 const rtspUrl = 'rtsp://example.com/stream.mp4'; // 创建RTSP客户端 const client = new rtsp.RTSPClient(); client.connect(rtspUrl); client.onMedia = ({ track, type }) => { // 将RTSP流添加到MediaStream中 stream.addTrack(track); // 如果是视频流,则将其绑定到video元素 if (type === 'video') { video.srcObject = stream; } }; client.start(); </script> </body> </html> ``` 这个代码片段使用了一个名为rtsp.js的开源库来实现WebRTC播放RTSP流。它创建了一个RTSP客户端,并将获取到的视频流添加到一个MediaStream中,最终将视频流绑定到一个video元素上,从而在浏览器中无插件播放RTSP视频流
评论 9
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值