AFrame 中的 AR 视频播放器只能在手机上播放音频

时间:2021-04-19 20:49:38

标签: video augmented-reality aframe

我正在尝试让 AR 视频在手机上显示和播放。基于此项目 https://github.com/vimeo/aframe-vimeo-component

目前代码在我的手机 (iOS) 上播放视频的音频,但视频保持黑色。

如果您访问上述链接,它会引导您找到适用于 VR 的 Glitch 示例/基础。

我有一个 AR 版本可以运行,但仅在此处的 Glitch 示例中的桌面上运行 - https://1page-araframe.glitch.me

要尝试自己的视频版本,您需要生成自己的 Vimeo_token 并通过添加 Vimeo_token 修改 .env 字段。

让音频和视频在手机上工作需要什么? 谢谢,

代码如下:

<!DOCTYPE html>
<html>
  <head>
    <title>Vimeo A-Frame Component</title>
    // from this https://github.com/vimeo/aframe-vimeo-component
    <meta name="apple-mobile-web-app-capable" content="yes">
    <script type="text/javascript" src="https://aframe.io/releases/1.2.0/aframe.min.js"></script>
    <script src="https://raw.githack.com/AR-js-org/AR.js/master/aframe/build/aframe-ar-nft.js"></script>
    <script type="text/javascript" src="/aframe-vimeo-component.min.js"></script>
    <link rel="stylesheet" type="text/css" href="/css/app.css">
  </head>
  <body style="background: #000;">
    <a-scene embedded arjs>
   
  
  <a-entity vimeo="id: 483770237" loop webkit-playsinline playsinline>
    <a-plane color="#000000" scale="3.2 1.8" position="0.0 3.4 -2.0"></a-plane>
  </a-entity>

<script>

  //Wait until the A-Scene component was loaded before doing anything
  document.querySelector('#vimeo-player').addEventListener('loaded', function () {
    var box = document.getElementById('box');
    var vimeoPlayer = document.querySelector('#vimeo-player').components.vimeo;

    //Register on box click event that triggers the player
    box.addEventListener('click', function () {
      if (vimeoPlayer.player.isPlaying()) {
        vimeoPlayer.pause();
      } else {
        vimeoPlayer.play();
      }
    });
  });


</script>
    </a-scene>
  </body>
</html>

0 个答案:

没有答案