RTSP流浏览器播放方案

前端代码

<template>
  <div>
    <video id="video" controls autoplay muted width="30%" height="30%"style="object-fit: fill" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      webRtcServer: null
    }
  },
  mounted() {
    // video：需要绑定的video控件ID
    // 127.0.0.1:8000：启动webrtc-streamer的设备IP和端口，默认8000
    this.webRtcServer = new WebRtcStreamer('video', location.protocol + '//' + '127.0.0.1:8000')
    // 需要查看的rtsp地址,根据自己的摄像头传入对应的rtsp地址即可。注意：视频编码格式必须是H264的，否则无法正常显示，编码格式可在摄像头的后台更改
    this.webRtcServer.connect('rtsp://admin:xxxxxxxxxx@192.168.1.250:554/Streaming/Channels/101')
  },
  // 销毁视频流
  beforeDestroy() {
    this.webRtcServer.disconnect()
    this.webRtcServer = null
  }
}
</script>

引入JS

  <script type="text/javascript" src="/config/webrtcstreamer.js"></script>
  <script type="text/javascript" src="/config/adapter.min.js"></script>

下载webrtc-streamer 解压缩

将下载包html文件夹下webrtcstreamer.js文件和html/libs文件夹下adapter.min.js文件复制到VUE项目public目录下 、在index.html文件里引入这两个js文件

 直接双击webrtc-streamer.exe，在浏览器输入127.0.0.1:8000可以看到自己的桌面，说明安装成功

我们这里要作为系统发给客户，所以将webrtc-streamer做成了注册自启动的模式，代码如下

run_vbs_script.vbs

' setup_startup.vbs
Dim fso, scriptFullName, scriptDir, exePath, startupKeyName, objShell, strCommand
Set fso = CreateObject("Scripting.FileSystemObject")
scriptFullName = WScript.ScriptFullName
scriptDir = fso.GetParentFolderName(scriptFullName)
exePath = fso.BuildPath(scriptDir, "start.vbs")

' 添加注册表项以在系统启动时运行 start.vbs
startupKeyName = "webrtcStreamerStartup"
Set objShell = CreateObject("WScript.Shell")
strCommand = "REG ADD HKCU\Software\Microsoft\Windows\CurrentVersion\Run /v " & startupKeyName & " /t REG_SZ /d """ & exePath & """ /f"
objShell.Run strCommand, 0, True

' 验证注册表项是否成功添加（可选）
' 注意：这里的验证只是检查注册表项是否存在，并不验证 start.vbs 是否能正确运行
Dim result
result = objShell.Run("REG QUERY HKCU\Software\Microsoft\Windows\CurrentVersion\Run /v " & startupKeyName, 0, True)
If result = 0 Then
    WScript.Echo "Successfully added " & exePath & " to startup."
    
    ' 立即运行 start.vbs 进行验证
    WScript.Echo "Now running " & exePath & " for verification..."
    objShell.Run exePath, 1, False ' 1 表示窗口模式运行，False 表示等待脚本完成
    
    ' 注意：如果 start.vbs 是一个长时间运行的任务，并且您不希望 setup_startup.vbs 等待它完成，
    ' 可以将 False 改为 True，但这样您就无法从 setup_startup.vbs 的输出中看到 start.vbs 的运行结果。
Else
    WScript.Echo "Failed to add " & exePath & " to startup."
End If

Set fso = Nothing
Set objShell = Nothing

start.vbs

Dim fso, scriptDir, exePath, Wsh
Set fso = CreateObject("Scripting.FileSystemObject")
Set Wsh = CreateObject("WScript.Shell")
 
scriptDir = fso.GetParentFolderName(WScript.ScriptFullName)
exePath = fso.BuildPath(scriptDir, "webrtc-streamer.exe")
 
' 尝试终止现有的 webrtc-streamer.exe 进程
Wsh.Run "taskkill /f /im webrtc-streamer.exe", 0, True
WScript.Sleep 2000 ' 等待一段时间以确保进程已终止（可以根据需要调整）
 
' 检查 webrtc-streamer.exe 是否存在并尝试运行它
If fso.FileExists(exePath) Then
    ' 以窗口最小化方式运行（1 表示最小化窗口，0 表示正常窗口，如果要隐藏窗口则需要其他方法）
    ' 第三个参数设置为 False 表示不等待进程完成
    Wsh.Run exePath & " -o", 0, True
Else
    WScript.Echo "webrtc-streamer.exe not found at: " & exePath
End If
 
' 清理对象
Set fso = Nothing
Set Wsh = Nothing
 
' 退出脚本
WScript.Quit

stop.vbs 

Dim fso, scriptDir, exePath, Wsh
Set fso = CreateObject("Scripting.FileSystemObject")
Set Wsh = CreateObject("WScript.Shell")
 
scriptDir = fso.GetParentFolderName(WScript.ScriptFullName) 
' 尝试终止现有的 webrtc-streamer.exe 进程
Wsh.Run "taskkill /f /im webrtc-streamer.exe", 0, True
' 清理对象
Set fso = Nothing
Set Wsh = Nothing
 
' 退出脚本
WScript.Quit

如果直接复制代码不能运行的话，可以直接私聊我。

该方案有两点需要注意：只接受H264、会占用本地资源 

脚本需要防止被360等杀毒软件直接删除