实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)

我们都知道,html中的video标签只能播放特定格式的视频,对这种视频流文件无能为力,而且网上的vue-video-player也只能播放特定格式的视频。要播放监控的实时视频,除了在浏览器的地址栏直接打开摄像头的地址(如:http://192.168.1.108,像大华和海康都可以给特定的http协议的接口),或者在vlc播放器中直接打开rtsp流的视频播放(下载vlc播放器,打开网络串流,输入大华方面给你的地址,点击播放即可),要内嵌监控视频到页面上貌似有点困难。

这里提供一种方案,我们可以用vlc播放器进行转码来播放:

步骤如下:

打开播放器点击打开网络串流:

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第1张图片

点击下一个,选择http后点击添加 

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第2张图片

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第3张图片

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第4张图片

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第5张图片

看到下面的时间轴有变化且头部变成你摄像头的视频地址即在转换 

实现rtsp协议实时监控视频在页面上的播放(使用vlc播放器转流)_第6张图片

然后我们只要在页面的video标签中调用即可:



    
        
        
    
    
         
    

 

你可能感兴趣的:(功能库)