为什么使用 ARJS 我的视频只能播放声音而不能播放视频？

Question

我正在使用 ARJS 构建增强现实应用程序。我正在使用图像作为标记，它似乎可以正常工作。目标是在图像跟踪器检测到正确的图像时播放视频，但是，它只播放音频而不是整个视频。

index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <link rel="stylesheet" href="css/styles.css">
  <script src="./js/image-tracker/aframe-master.min.js"></script>
  <script src="./js/image-tracker/aframe-ar-nft.js"></script>
  <title>Test</title>
  <script>
    AFRAME.registerComponent('controller', {
        init: function() {
          this.toggle = false;
          this.video = document.querySelector('#video');
          this.video.pause();
        },

        tick: function() {
          if (this.el.object3D.visible === true) {
            if (!this.toggle) {
              this.toggle = true;
              this.video.play();
            }
          } else {
            this.toggle = false;
            this.video.pause();
          }
        }
      })
  </script>
</head>

<body>
  <div class="arjs-loader">
    <div>Loading, please wait...</div>
  </div>
  <a-scene
    vr-mode-ui="enabled: false;"
    renderer="logarithmicDepthBuffer: true;"
    embedded
    arjs="trackingMethod: best; sourceType: webcam;debugUIEnabled: false;"
  >
    <a-assets>
      <video id="video" src="http://localhost:5000/assets/animation.mp4" webkit-playsinline playsinline></video>
    </a-assets>

    <a-nft
      controller
      type="nft"
      url="./image_descriptors/car"
      smooth="true"
      smoothCount="10"
      smoothTolerance="0.01"
      smoothThreshold="5"
    >
      <a-video
        width="1.75"
        height="2"
        position="200 0 -10"
        rotation="0 90 0"
        src="#video"
      ></a-video>
    </a-nft>
    <a-entity camera></a-entity>
  </a-scene>
</body>
</html>

Answer 1

可能有多种原因，以下是其中一些：

确保没有控制台错误并且场景加载正确（你的沙箱给了我 out of memory!!! 问题，也有一些 CORS 问题）。
确保视频位于标记的顶部。我会用一个超大的盒子（或检查员）来找出物品在哪里，并调整位置/比例。

我已经将你的 car.jpg 大小调整为 1024x1024 并制作了 NFT 描述符，它似乎可以正常工作 link to the forked sandbox with new descriptors :

为什么使用 ARJS 我的视频只能播放声音而不能播放视频？

Why does my video only play sound and no video with ARJS?

video

augmented-reality

artoolkit

aframe

ar.js