html中嵌入VLC播放器（页面展示大华摄像机实时监控）

最新推荐文章于 2025-06-30 19:02:47 发布

liu_qixiang

最新推荐文章于 2025-06-30 19:02:47 发布

阅读量1w

点赞数 2

CC 4.0 BY-SA版权

分类专栏： jquery

本文链接：https://blog.youkuaiyun.com/qi923701/article/details/79882706

jquery 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了如何通过VLC插件将RTSP视频流接入第三方系统的方法。利用HTML页面及VLC插件，实现了不同品牌监控设备视频流的播放，并提供了具体的URL配置示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这几天用户提了一个新的需求，用户原本有一个监控系统，里面有多个摄像头监控。现在用户希望在另外一个第三方的系统中，接入某些监控场景。
咨询了一下监控系统的技术，对方支持使用rtsp的形式接入播放流媒体。于是结合网上的资料，决定使用vlc来实现该功能。

其实思路非常简单，先下载安装VLC的插件，然后写一个页面，页面中，指定好对应的rtsp视频地址就好了。

html代码

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>


<!--[if IE]>
   <object type='application/x-vlc-plugin' id='vlc' events='True'
       classid='clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921' codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab" width="720" height="540">
          <param name='mrl' value='rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp' />
          <param name='volume' value='50' />
          <param name='autoplay' value='true' />
          <param name='loop' value='false' />
          <param name='fullscreen' value='false' />
    </object>
<![endif]-->
<!--[if !IE]><!-->
    <object type='application/x-vlc-plugin' id='vlc' events='True' width="720" height="540" pluginspage="http://www.videolan.org" codebase="http://downloads.videolan.org/pub/videolan/vlc-webplugins/2.0.6/npapi-vlc-2.0.6.tar.xz">
        <param name='mrl' value='rtsp://admin:admin@10.12.4.84:554/cam/realmonitor?channel=2&subtype=1' />
        <param name='volume' value='50' />
        <param name='autoplay' value='true' />
        <param name='loop' value='false' />
        <param name='fullscreen' value='false' />
    </object>


<!--<![endif]-->



</body>
</html>

海康：

rtsp://[username]:[password]@[ip]:[port]/[codec]/[channel]/[subtype]/av_stream
说明：
username: 用户名。例如admin。
password: 密码。例如12345。
ip: 为设备IP。例如 192.0.0.64。
port: 端口号默认为554，若为默认可不填写。
codec：有h264、MPEG-4、mpeg4这几种。
channel: 通道号，起始为1。例如通道1，则为ch1。
subtype: 码流类型，主码流为main，辅码流为sub。

例如，请求海康摄像机通道1的主码流，Url如下
主码流：
rtsp://admin:12345@192.0.0.64:554/h264/ch1/main/av_stream
rtsp://admin:12345@192.0.0.64:554/MPEG-4/ch1/main/av_stream

子码流：
rtsp://admin:12345@192.0.0.64/mpeg4/ch1/sub/av_stream
rtsp://admin:12345@192.0.0.64/h264/ch1/sub/av_stream

大华：
rtsp://username:password@ip:port/cam/realmonitor?channel=1&subtype=0
说明:
username: 用户名。例如admin。
password: 密码。例如admin。
ip: 为设备IP。例如 10.7.8.122。
port: 端口号默认为554，若为默认可不填写。
channel: 通道号，起始为1。例如通道2，则为channel=2。
subtype: 码流类型，主码流为0（即subtype=0），辅码流为1（即subtype=1）。

例如，请求某设备的通道2的辅码流，Url如下
rtsp://admin:admin@10.12.4.84:554/cam/realmonitor?channel=2&subtype=1