从 A-frame 自动播放 videosphere 不适用于任何浏览器(Safari/Chrome)

2024-02-06

我正在开发一些 A 框架项目,但 videosphere 没有自动播放其源代码。我从cinema4d渲染了一个球体视频并注入了元数据,我可以看到源已加载,但未播放。

我原本想在本地播放60MB的视频,但是即使我将视频剪切到1MB以下,它仍然无法正常工作,所以我认为这不是大小的问题。

我尝试了有声视频和无声视频,但都不起作用。

我也尝试过在其他人的项目中有效。

这是视频的链接,如果您也可以查看视频的话!

https://drive.google.com/open?id=1F3VLYFTSnnlmRY1-xYxOe2SEWjZDwI9q https://drive.google.com/open?id=1F3VLYFTSnnlmRY1-xYxOe2SEWjZDwI9q https://drive.google.com/open?id=1kshs3IqJD0nMi0-fGLibnMDg9wc9lrxx https://drive.google.com/open?id=1kshs3IqJD0nMi0-fGLibnMDg9wc9lrxx

<!DOCTYPE html>
<html>
  <head>
    <title>Palm to Room</title>
       <link rel="stylesheet" href="style.css" />
   <script src="https://aframe.io/releases/0.9.2/aframe.min.js"></script>


    </head>

    <body>
     <a-scene>
        <a-assets>
        <video
          id="BankVideo"
          autoplay
          loop="true"
         preload="auto" crossorigin="anonymous"
         src="src/sample-ij.mp4"
        >
        </video>
      </a-assets>

      <a-videosphere
                     id="EnvBank"
        rotation="0 180 0"
        src="#BankVideo">
      </a-videosphere>

      <!-- Define camera with zero user height, movement disabled and arrow key rotation added. -->
      <a-camera
        user-height="0"
        wasd-controls-enabled="false">
        </a-entity>
      </a-camera>

    </a-scene>

    </body>
</html>

***** 更新 ***** 我按照@PiotrAdamMilewski 在评论中建议的方式研究了一些问题,但它仍然没有真正起作用。但我发现当我添加这个脚本并将这个aframe组件使用到videosphere时,我可以播放视频。所以我认为这不是真正的浏览器或操作系统问题...

所以现在我正在尝试将组件调整为触发视频播放的组件(最初应该自动播放)。我对 Aframe 组件真的很陌生,所以这确实需要一段时间,但如果有人可以对此添加一些建议,我真的很感激!

AFRAME.registerComponent('play-on-window-click', {
  init: function () {
    this.onClick = this.onClick.bind(this);
  },
  play: function () {
    window.addEventListener('click', this.onClick);
  },
  pause: function () {
    window.removeEventListener('click', this.onClick);
  },
  onClick: function (evt) {
    var video = this.el.components.material.material.map.image;
    if (!video) { return; }
    video.play();
  }
});

据我所知 https://github.com/aframevr/aframe/issues/3136(还检查这个链接 https://stackoverflow.com/questions/47515799/html-video-tag-autoplay-in-safari-without-user-interaction)、macOS 或 iOS safari 已禁用自动播放。尽管自动播放政策似乎vary https://bitmovin.com/play-not-play-new-autoplay-policies-safari-11-chrome-64/有时取决于 chrome 或 safari(及其版本)muted允许视频自动播放。

您应该添加任何用户交互来播放视频

btn.addEventListener('click', function() {
   videoElement.play()
})
// assuming btn is any clickable object, and videoElement is the <video>

至于组件,你可以简单地调用play()关于视频元素,无需深入材料:

AFRAME.registerComponent('play-on-window-click', {
  init: function () {
    this.onClick = this.onClick.bind(this);
  },
  play: function () {
    window.addEventListener('click', this.onClick);
  },
  pause: function () {
    window.removeEventListener('click', this.onClick);
  },
  onClick: function (evt) {
   var video = document.getElementById('BankVideo')
   if (!video) { return; }
   video.play();
  }
});

glitch here https://glitch.com/~stack-57542229


It seems you also can call play() on the element after it's loaded. It works on macOS Sierra 10.13.6. Same glitch, just the timeout.html
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

从 A-frame 自动播放 videosphere 不适用于任何浏览器(Safari/Chrome) 的相关文章

随机推荐

  • 没有实际块的 if 块内的声明是否有效?

    以下代码有效吗 如果有的话 范围是什么x int main if true int x 42 我的直觉告诉我 没有创建任何范围if因为没有实际的块 遵循它 GCC 4 7 2 向我们展示了 虽然代码是valid 的范围x仍然是简单的条件式
  • 我可以将 iPhone/iPad 作为 Eddystone Beacon 进行广播吗?

    我们可以让 iOS 设备充当 iBeacon 发射器 如果我们知道附近的 iBeacon 的 Proximity UUID 我们就可以找到它们 通过Google的Proximity Beacon API 可以配置和注册真正的Beacon硬件
  • 如何在 PostgreSQL 中高效设置减连接表?

    我有以下表格 work units 不言自明 workers 不言自明 skills 如果你想从事每个工作单位 都需要一些技能 每个工人都精通多项技能 work units skills 连接表 workers skills 连接表 工作人
  • 如何在 C# 中锁定整数?

    C 有没有办法锁定整数 整数不能与锁一起使用 因为它们是装箱的 并且仅锁定引用上的锁 场景如下 我有一个基于论坛的网站 具有审核功能 我想要做的是确保在任何给定时间只有一位版主可以审核帖子 为了实现这一点 我想锁定帖子的 ID 到目前为止
  • Memcache 打开后 Magento 会话消失

    我们遇到一个问题 当我们启用 memcache 在 nginx Web 服务器上 时 会话会从 Magento 1 10 中随机消失 我们在 Magento 中设置 cookie 过期时间似乎并不重要 由于某种原因 会话在一小时内的任何随机
  • 带有 mysql (Cloud SQL) 的谷歌应用程序引擎是否支持 GIS?

    我试图在应用程序引擎和云 sql 网站上找到一些关于此的文档 但找不到任何引用它的内容 我知道您可以对其自定义 sql 选项执行 GIS 查询 并且我知道 mysql 支持开箱即用的 GIS 但我也知道它需要一些支持有限的 C 库 更具体地
  • 如何保护我的网站免遭会话固定?

    目前我们面临着会话固定的问题 我们确实有一个受保护的站点 即 HTTPS 并且没有对其进行身份验证 这意味着它具有匿名访问权限 因此 我们面临着黑客的会话固定问题 有人可以帮助和指导吗 您应该在这里找到您需要的信息 OWASP https
  • java.lang.IllegalArgumentException:不是有效的类名:ANDROID NDK javah

    我正在学习在 WINDOWS Eclipse 上的 NDK 中编写 Android 代码 一直在关注 Sylvain Ratabouil 的教程书 所以我在跑步 外部工具 外部工具配置 创建新的程序配置 名称 MyProject javah
  • ADO.NET 数据服务 - 上传文件

    我正在尝试编写 REST Web 服务 通过该服务我们的客户可以将文件上传到我们的文件服务器上 是否有示例或任何有用的链接可供我参考以获取指导 我还没有看到很多使用 ADO NET 数据服务进行 POST 操作的示例 我已使用 POST 将
  • iOS 6 Web Audio API 没有声音

    我很高兴看到 iOS 6 支持 Web Audio API 因为我们制作 HTML5 游戏 但是 我无法让 iOS 6 使用 Web Audio API 播放任何声音 其中的示例在桌面 Chrome 中运行良好 这是一个带有触摸控制并通过
  • 记录 C(或可能是 C++)中 X 宏的使用模式的良好参考资料是什么?

    的基本定义和示例以及一些参考资料X Macros http en wikipedia org wiki C preprocessor X Macros 在此给出C 预处理器的维基百科条目 http en wikipedia org wiki
  • 有效地将矩阵值复制到新矩阵

    是否有一种有效的内置方法可以从一个矩阵复制值 例如 double 到另一个 换句话说 我正在寻找以下函数的替代品 public static double CloneMatrix double aMatrix var newMatrix n
  • AutoCompleteTextView 和 Spinner 使用相同适配器时出现问题

    我有一个 类别 列表 它们作为字符串存储在我的应用程序的 ArrayAdapter 中 这很简单 适配器是活动的一个字段 可以在任何地方访问 它是在 onCreate 期间填充值的 我有一个 条目 对话框 其中包含一个 AutoComple
  • C中循环条件下的逗号运算符

    include
  • 有没有可以浏览您应用程序的 iCloud 数据的工具?

    我正在努力将 iCloud 集成到我的应用程序中 有时会遇到冲突和保存错误的问题 数据存储在云端的事实使得调试问题变得非常困难 据我所知 iCloud 服务器上的数据会镜像到设备上的目录中 有没有任何工具 iOS 或 OSX 应用程序 可以
  • Angular Tour of Heroes:inMemory Web API 的问题

    我正在学习著名的 Angular 教程 英雄之旅 但我在迈出一步时遇到了困难 On the 第六课 HTTP https angular io tutorial toh pt6 我们正在使用一个模拟 API 调用 API 的工具 我想我遵循
  • 模拟NLog的记录器并读取记录的消息

    我使用 NLog 4 5 11 进行日志记录 使用 moq 4 10 1 进行模拟 我有一个中间件 它使用 NLog 将异常详细信息写入日志文件 我需要在 API 项目中对中间件进行单元测试 并检查记录的消息是否有正确的值 这就是我声明异常
  • 在 Powershell 中用于退出 Python 的 Ctrl-C 现在不起作用

    在 Powershell 命令提示符中使用 Ctrl C 时 Python 无法退出 而是给出 KeyboardInterrupt 字符串 最近我重新安装了 Windows 10 在重新安装之前 Ctrl C 退出 python 3 5 2
  • 无法将 Pod 更新到最新版本

    我正在使用react native 并且我正在尝试使用以下命令来更新pod pod update 但它什么也没更新 但是 当我使用 pod outdated 它显示了这个 Updating spec repo master usr bin
  • 从 A-frame 自动播放 videosphere 不适用于任何浏览器(Safari/Chrome)

    我正在开发一些 A 框架项目 但 videosphere 没有自动播放其源代码 我从cinema4d渲染了一个球体视频并注入了元数据 我可以看到源已加载 但未播放 我原本想在本地播放60MB的视频 但是即使我将视频剪切到1MB以下 它仍然无