WebGL使用VideoPlayer播放视频

于 2022-11-28 15:43:36 发布
阅读量1.2k 收藏 2
点赞数
文章标签： webgl 音视频
原文链接：https://blog.csdn.net/ThreePointsHeat/article/details/108389992
版权

在PC端使用VideoPlayer播放视频是可以的，但是发布WebGL不能播放；具体原因就是PC加载本地视频不需要进行缓存直接播放，而在打包WebGL时，加载视频不能播放，具体就是缓存视频流的问题。只需要通过事件控制一下就可以播放。查看console面板可以看到

Embedded video clips are not supported by the WebGL player: Assets/868da12ce5ab6245d37ca9801f0f2185.mp4. Use the Video Player component’s URL option instead.

在这里插入图片描述

在这里插入图片描述

染指流年丨
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
【虚拟仿真】Unity3D打包WEBGL后播放视频（VideoPlayer组件）
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
04-21 2866
本篇文章实现Unity3D打包WEBGL后播放视频，如下图所示：使用了VideoPlayer组件，代码比较简单。主要就是有几个需要注意的点。
Unity 3D Video Player WebGL
12-03
VideoPlayer组件允许我们在场景中加载和播放视频文件，支持多种视频格式，如MP4、WebM等。开发者可以通过脚本接口控制视频的播放、暂停、停止以及调整音量等操作，甚至可以将视频渲染到自定义的纹理上，以便在3D模型...
UnityWebGL播放视频（PC端）
SusieMiao的博客
12-06 5336
本人所用Unity版本2018.3.0。利用Unity自带的VideoPlayer实现WebGL端播放视频。文章末尾附带工程，可自行下载。 1.新建UI RawImage-----在Project视图下新建RenderTexture-----将RenderTexture拖入到RawImage的Texture中。 2.在RawImage上添加VideoPlayer组件----Source选择UR...
Video Player WebGL 1.4
07-14
支持Webgl自动播放视频,支持unity2019以上版本,强烈推荐
【愚公系列】2022年09月 微信小程序-WebGL动画的使用
时光隧道
09-11 1万+
WebGL（全写Web Graphics Library）是一种3D绘图协议，这种绘图技术标准允许把JavaScript和OpenGL ES 2.0结合在一起，通过增加OpenGL ES 2.0的一个JavaScript绑定，WebGL可以为HTML5 Canvas提供硬件3D加速渲染，这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了，还能创建复杂的导航和数据视觉化。
谷歌浏览器webgl不受支持
good_game_的博客
12-08 6178
谷歌浏览器webgl不受支持 1.由于在项目中需要播放rtsp视频流，用到VXG Media Player NaCl插件 但是安装过程一直提示webgl不受支持，最终摸索出解决方案。 解决方案 1.gpu无法渲染 通过在浏览器输入chrome://flags/ 进入以下页面 修改状态为enable后进入浏览器文件夹所在位置，通过命令行打开浏览器 强制渲染，就可以正常安装使用了. ...
html页面中该插件不受支持,该插件不受支持怎么解决
weixin_36469726的博客
06-03 1万+
我们经常会在电脑中使用浏览器来浏览各种网页，可是最近有很多小伙伴在浏览某网页视频的时候，却显示该插件不受支持，导致无法正常浏览，这该怎么办呢，其实解决方法也不难，为了帮助大家解决这个问题，小编这就给大家讲述一下网页显示该插件不受支持的解决教程。具体步骤如下：1、登录网页，点击一个视频播放。2、之后，显示如下图。该插件不受支持，还有一些其他情况，也会如此。3、下面，我们找度娘，输入如下图，点击进入。...
Unity打包WebGL视频播放问题
wangjingxhz的博客
10-23 2363
1.新建RawImage 2.给RawImage挂载VideoPlayer脚本 3.新建RenderTexture 4.将第3步新建的RenderTexture拖拽到RawImage挂载的脚本RawImage的Texture属性中 5.将第3步新建的RenderTexture拖拽到RawImage挂载的脚本VideoPlayer的TargetTexture属性中 6.选中RawImage，设置Vi...
支持WebGL视频文件格式的unity插件
05-25
支持unity发布webGL端的视频播放 把unity的MovieTexture类转换成webGL可用的类
unity3d webgl播放视频 自用备份
11-04
总结来说，"unity3d webgl播放视频 自用备份"项目涉及了Unity3D的WebGL导出、视频资源的处理、Unity的Video Player组件的使用、JavaScript与Unity的交互、浏览器兼容性测试以及性能优化等多个方面。理解并掌握这些...
UnityWebGL播放在线视频m3u8两种方案
04-15
3. **播放视频**：通过调用VideoPlayer的Play方法启动视频播放。你可以添加事件监听器来处理播放、暂停、停止等操作。 4. **渲染视频**：AVProVideo可以将视频渲染到游戏对象的材质上，或者使用其内置的UI组件进行...
Unity WebGl播放m3u8在线视频(监控，直播)的项目和Demo
04-15
3. Unity VideoPlayer组件的使用，包括设置网络播放源。 4. Unity WebGL与不同Unity版本之间的差异，特别是对HLS的支持。 5. 跨浏览器的HLS播放支持，可能需要借助JavaScript库如hls.js。 6. 监控和直播应用的优化，...
GL/gl.h: No such file or directory
热门推荐
u013122984的专栏
03-12 13万+
install OpenGL in brief: $ sudo apt-get install build-essential 安装OpenGL Library $sudo apt-get install libgl1-mesa-dev 安装OpenGL Utilities $sudo apt-get install libglu1-mesa-dev
【Unity WebGL】UnityWebGL相关的小技巧（一）
qq_36423720的博客
09-07 2985
Unitywebgl 相关技巧
webgl基础篇视频教程-坚如磐石
11-19
webgl入门视频课程从基础开始介绍webgl技术,介绍基本的webgl渲染管线,各种常用的缓冲区的作用,以及用法,结合程序实例做到全方位的讲解；精讲三维的理论,针对三维理论中的三个矩阵变换一个坐标变换深入讲解.针对webgl核心技术逐个讲解；针对可编程管线,理论结合实践,让学员深刻的体验到shader的作用；重点围绕webgl的核心技术进行实践。
WebGL播放器设置（自翻）
张旭的博客
01-22 3169
WebGL播放器设置 本页面详细介绍了WebGL特有的播放器设置。一般播放器设置的描述可以在这里找到。 其他设置 属性： 功能： 渲染 渲染路径 该渲染路径为游戏启用。 自动图形API 如果要手动选择使用哪个图形API，请取消选中此选项。选中时，Unity包含WebGL2.0，WebG
Unity WebGL 使用VideoPlayer播放视频“CORS 头缺少 ‘Access-Control-Allow-Origin‘”
boyZhenGui的博客
12-16 1487
WebGL播放视频的坑真是好多。 本文使用的是Unity原生的VideoPlayer组件播放在线视频，编辑器加载正常，在WebGl端无法加载。（测试链接为网络连接。） 按F12，发现出现错误 上网搜索，都说是跨域问题，需要更改服务器的’Access-Control-Allow-Origin’属性为*。 或者发送请求时’Access-Control-Allow-Origin’为*。 想到可能是网络URL不支持我访问，因此用电脑开本地服务器测试，结果也是一样。 不懂服务器，不会更改设置’Access-Cont
unity webgl 发布webgl版本播放视频
最新发布
06-06
要在Unity WebGL项目中播放视频，你需要使用HTML5标签，例如`<video>`标签。你可以通过以下步骤来实现： 1. 将视频文件添加到Unity项目中，并将其放置在WebGL Build Settings中指定的WebGL输出文件夹中。 2. 在Unity中创建一个UI画布，并添加一个RawImage组件。 3. 在画布中创建一个UI按钮，并将其与一个新的脚本组件相关联。 4. 在脚本中，使用HTML5 `<video>`标签和JavaScript API创建一个视频对象，并将其与RawImage组件关联。 5. 在按钮的OnClick事件中，使用JavaScript API播放视频。 以下是一个示例脚本的基本结构： ```csharp using UnityEngine; using UnityEngine.UI; using System.Collections; public class VideoPlayer : MonoBehaviour { RawImage image; string videoURL = "your_video_url.mp4"; IEnumerator Start() { image = GetComponent<RawImage>(); // Load and wait for the video to be ready UnityWebRequest videoRequest = UnityWebRequest.Get(videoURL); yield return videoRequest.SendWebRequest(); // Create a video object and assign it to the RawImage var videoPlayer = gameObject.AddComponent<UnityEngine.Video.VideoPlayer>(); videoPlayer.playOnAwake = false; videoPlayer.source = UnityEngine.Video.VideoSource.Url; videoPlayer.url = videoURL; videoPlayer.renderMode = UnityEngine.Video.VideoRenderMode.RenderTexture; videoPlayer.targetTexture = new RenderTexture(1920, 1080, 16, RenderTextureFormat.ARGB32); image.texture = videoPlayer.targetTexture; // Play the video videoPlayer.Prepare(); while (!videoPlayer.isPrepared) { yield return null; } videoPlayer.Play(); } public void PlayVideo() { var videoPlayer = GetComponent<UnityEngine.Video.VideoPlayer>(); videoPlayer.Play(); } } ``` 你可以在按钮的OnClick事件中调用PlayVideo()函数来播放视频。请注意，在这个示例中，视频的URL是硬编码在代码中的，你应该将其替换为你自己的视频URL。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值