Untiy中如何嵌入前端页面，从而播放推流视频？

server/2025/1/16 4:20:46/

最近工作中频繁用到unity,虽然楼主之前也搞过一些UNTY游戏开发项目，但对于视频这块还是不太了解，所以我们采用的方案是在Unity里寻找一个插件来播放推流视频。经过我的一番寻找，发现了这款Vuplex 3D WebView，它可以完美的打通Unity和前端js。

具体步骤如下：

下载资源包，如果觉得收费，可以找楼主要资源哈。这里就不挂链接了。

在资源包里包含了很多个例子，其中有一个叫做SimplewebvidwDemo的例子，大家可以参照这个例子来实现自己需求。

这个插件本身也带有很多的说明文档，如果觉得不太懂怎么用，可以看看文档，只不过文档是英文的。

新建一个预制体，添加脚本，这个预制体也是例子里的， 我们可以改动尺寸调整大小哈。

接着就是写一个自己的类，来执行视频加载的逻辑。具体可以看看我下面的写法

public class SimpleView : MonoBehaviour
{public  WebViewPrefab _webViewPrefab;// Start is called before the first frame updatevoid Awake(){Web.SetUserAgent(false);}// Update is called once per frameasync void Start(){// The WebViewPrefab's InitialUrl property is set via the editor, so it// automatically loads that URL when it initializes._webViewPrefab = GameObject.Find("WebViewPrefab").GetComponent<WebViewPrefab>();//  _setUpKeyboards();// Wait for the WebViewPrefab to initialize, because the WebViewPrefab.WebView property// is null until the prefab has initialized.await _webViewPrefab.WaitUntilInitialized();_webViewPrefab.WebView.LoadUrl("streaming-assets://index.html");// The WebViewPrefab has initialized, so now we can use the IWebView APIs// using its WebViewPrefab.WebView property.// https://developer.vuplex.com/webview/IWebView_webViewPrefab.WebView.UrlChanged += (sender, eventArgs) => {Debug.Log("[SimpleWebViewDemo] URL changed: " + eventArgs.Url);};await _webViewPrefab.WebView.WaitForNextPageLoadToFinish();// _webViewPrefab.WebView.PostMessage("{\"type\": \"greeting\", \"message\": \"Hello from C#!\"}");/* await _webViewPrefab.WebView.ExecuteJavaScript(@"
startPlay('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F', sdkList.sdk2, setSrcObjectCallback2)
");*///  await _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");//}public void PlayTwoVideoUrl(string url){// url = "webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F";// webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F;var value = string.Format(@"androidToJs_layoutTwo('{0}')", url);Debug.Log(@value);_webViewPrefab.WebView.ExecuteJavaScript(@value);//  _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");}public void PlayOneVideoUrl(string url){// url = "webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F";// webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F;var value = string.Format(@"androidToJs_layoutOne('{0}')", url);Debug.Log(@value);_webViewPrefab.WebView.ExecuteJavaScript(@value);//  _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");}public void PlayThreeVideoUrl(string url){// url = "webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F";// webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F;var value = string.Format(@"androidToJs_layoutThree('{0}')", url);Debug.Log(@value);_webViewPrefab.WebView.ExecuteJavaScript(@value);//  _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");}public void PlayFourVideoUrl(string url){// url = "webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F";// webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F;var value = string.Format(@"androidToJs_layoutFour('{0}')", url);//Debug.Log(@value);_webViewPrefab.WebView.ExecuteJavaScript(@value);//  _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");}public void PlayFiveVideoUrl(string url){// url = "webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F";// webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F;var value = string.Format(@"androidToJs_layoutFive('{0}')", url);Debug.Log(@value);_webViewPrefab.WebView.ExecuteJavaScript(@value);//  _webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_back('webrtc://148.70.213.246:21985/rtmplive/15-43-48-0C-11-1F-1E-41-4D-64-30-00-00-C0-D5-88-AF-02-3F')");}public  void  InitVideo(){_webViewPrefab.WebView.ExecuteJavaScript(@"androidToJs_close()");}public void SetVideoLayout(string layout ="1"){var value = string.Format(@"changeLayout('{0}')", layout);_webViewPrefab.WebView.ExecuteJavaScript(@value);}
}

像里面的androidToJs_layoutThree是我们跟前端页面的通讯函数，可以问前端取得，上层只需要调用这个类封装好的函数，就能实现视频的播放和暂停功能 。


http://www.ppmy.cn/server/158268.html

相关文章

【Excel】【VBA】根据某列的编号顺序筛选对应的行导入相应的sheet中

【Excel】【VBA】根据某列的编号顺序筛选对应的行导入相应的sheet中

Excel VBA 数据分类导入sheet 1. 程序功能 将Excel表格数据按照PC编号分类到不同Sheet。 2. 程序流程 #mermaid-svg-mKz9P9fN9JJgn75t {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-mKz9P9fN9JJgn75t .error-ic…
阅读更多...
iOS - runtime总结

iOS - runtime总结

详细总结一下 Runtime 的核心内容&#xff1a; 1. 消息发送机制 // 消息发送的基本流程 id objc_msgSend(id self, SEL _cmd, ...) {// 1. 获取 isaClass cls object_getClass(self);// 2. 查找缓存IMP imp cache_getImp(cls, _cmd);if (imp) return imp(self, _cmd, ...);…
阅读更多...
开源AI模型的优势、挑战与未来发展分析

开源AI模型的优势、挑战与未来发展分析

开放源代码模型在灵活性和生态系统方面具有竞争力&#xff0c;可能会超越闭源API 开放源代码模型在灵活性和生态系统方面的竞争力主要体现在以下几个方面&#xff1a; 1. 灵活性 定制化能力: 开放源代码模型允许用户根据特定需求进行修改和调整。这种灵活性使得开发者能够根…
阅读更多...
【YOLOv5】源码（train.py）

【YOLOv5】源码（train.py）

train.py是YOLOv5中用于模型训练的脚本文件&#xff0c;其主要功能是读取配置文件、设置训练参数、构建模型结构、加载数据、训练/验证模型、保存模型权重文件、输出日志等 参考笔记&#xff1a; 【YOLOv3】源码&#xff08;train.py&#xff09;_yolo原始代码-CSDN博客 【y…
阅读更多...
Blazor开发复杂信息管理系统的优势

Blazor开发复杂信息管理系统的优势

随着现代企业信息管理需求的不断提升&#xff0c;开发高效、易维护、可扩展的系统变得尤为重要。在这个过程中&#xff0c;Blazor作为一种新兴的Web开发框架&#xff0c;因其独特的优势&#xff0c;逐渐成为开发复杂信息管理系统的首选技术之一。本文将结合Blazor在开发复杂信息…
阅读更多...
第一章 Anaconda包管理工具安装

第一章 Anaconda包管理工具安装

一、Anaconda是什么 1.Anaconda是一个开源的包管理系统和环境用于安装多个版本的软件包的管理系统及其依赖项&#xff0c;并在它们之间轻松切换。它适用于Linux、macOS和Windows&#xff0c;并且是为Python程序创建的&#xff0c;但可以 打包和分发任何软件 2.Anaconda是一个数…
阅读更多...
C# 内存篇

C# 内存篇

C#程序在CLR上运行的时候&#xff0c;内存从逻辑上划分为两大块&#xff1a;堆(托管堆)和栈(堆栈)。 堆&#xff1a;堆是一块动态分配的内存区域&#xff0c;用于存储对象和数据&#xff0c;堆内存的分配和释放由CLR(公共语音运行库)管理&#xff0c;通过垃圾回收&#xff08;G…
阅读更多...
学习threejs，使用TrackballControls相机控制器

学习threejs，使用TrackballControls相机控制器

&#x1f468;‍⚕️ 主页&#xff1a; gis分享者 &#x1f468;‍⚕️ 感谢各位大佬 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍⚕️ 收录于专栏&#xff1a;threejs gis工程师 文章目录 一、&#x1f340;前言1.1 ☘️THREE.TrackballControls 相…
阅读更多...
最新文章

Copyright @ 2022~2023