【Unity 3D】怎么在 WebGL 中播放 RTSP 监控

maltadirk · 发表于 2022-3-5 22:19

经常有兄弟伙在群里问怎么实现 WebGL 播放 rtsp 监控，真就是隔行如隔山，如果有个网页前端，咱们 Unity 开发哪至于这么苦啊！
闲话少述，本文这就教大家如何在 WebGL 中播放 RTSP 监控。

前言：

刚开始接触 WebGL 中播放监控的需求，大家都是希望 AVPRO、UMP 能出奇迹，但是遗憾暂时不支持。其实吧，这玩意人家网页前端浏览器接监控能接出花来：

方案一：监控厂商不是有网页版的终端嘛，网页前端直接能够拆解出来，你要啥给你拆解啥，最后以 <div> 或者 <iframe> 标签整到你的Unity webgl 容器之上。
方案二： 使用成熟的基于 webrtc 的第三方推流服务器，向浏览器推流，浏览器直接使用 <video> 标签播放。

作为 Unity 开发，方案一就不做讨论，方案二就列举几个推流服务器，也不方便强行解释。
https://github.com/ZLMediaKit/ZLMediaKit
https://github.com/daniulive/SmarterStreaming
https://github.com/aler9/rtsp-simple-server
https://github.com/648540858/wvp-GB28181-pro //GB28181 应该值得深耕监控的同学关注
https://github.com/deepch/RTSPtoWebRTC

我使用了第二个方案中提到的 RTSPtoWebRTC，不为别的，怎么简单怎么来啊！
下面我们简单的谈谈如何依附 RTSPtoWeb 实现 RTSP 的网页播放(行文时发现人家推荐 RTSPtoWeb，试试就试试)。
效果：

图中控制台程序是 RTSPtoWeb 推流服务器

实现：

1. 下载、编译 RTSPtoWeb 推流服务器：

2. 安装 Go 开发环境 - 菜鸟教程
2.1. 下载&安装合适的版本

笔者选择的版本

2.2 设置 golang 国内代理（Windows）：

go env -w GOPROXY=https://goproxy.cn,direct
2.3 设置 GO111MODULE （模组、包管理模块）
go env -w GO111MODULE=on

测试运行
按住 shift 键，对着项目所在文件夹右键，选择：“在此处打开 powershell 窗口”
执行以下指令

go run .// 如果上面的指令不行，执行下面这个go run *.go
你会看到下面的界面就表示推流服务器已经开启了：

此时，通过 http://127.0.0.1:8083即可访问推流服务器内置的测试页面了：

由于笔者没有网络相机，所以使用网络上流行的那个 rtsp 测试流，如果你也没有网络相机，可以拿来一试，但这种视频可能表现的很不流畅：

rtsp://wowzaec2demo.streamlock.net:554/vod/mp4:BigBuckBunny_115k.mov

编译
承接上一步，运行以下指令即可自动编译成 exe 运行文件

go build .// 下面指令可选go clean

运行服务器 RTSPtoWeb.exe
首次运行（包含测试运行）会弹出如图示窗口，由于测试环境为内网，为避免异常，勾选专用网络+公用网络

2. 修改 WebGL Template 接入相关逻辑：

3. 实现 Unity 点击弹窗播放监控

使用 PhysicsRaycastor + IpointerClickHandler 实现监控模型交互，见 SecurityCamera.cs
扩展阅读

总结：

版权所有转载请注明出处

		自动登录	找回密码
密码			立即注册

【Unity 3D】怎么在 WebGL 中播放 RTSP 监控

本帖子中包含更多资源