1

我刚刚接触了 AR.js,并试图让视频在 AR 中运行;提到了这段代码 - https://github.com/jeromeetienne/ar.js#augmented-reality-for-the-web-in-less-than-10-lines-of-html并参考其他帖子进行了调整博客。我有视频的第一帧(下面提到的平台和结果)。但是,它不会播放。

平台 -结果

  1. Mac OS 10.12, Chrome 67.0.3396.99 (Official Build) (64-bit) - 视频卡在第一帧Mac OS 10.12, Safari 10.0 (12602.1.50.0.10) -相机错误 - “WebRTC 问题 -!navigator.mediaDevices 不存在在您的浏览器中”->现在不担心这个;一个单独的问题Android 8.0.0 (OnePlus 3T), Chrome 68.0.3440.91 - black plane, 不确定视频是否加载

我的目标平台是 iOS 和 Android。无法在 iOS 上尝试,因为我只有 Android 设备。

这是我调整后的代码:

<!doctype HTML>
<html>
<script src="https://aframe.io/releases/0.6.1/aframe.min.js"></script>
<script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.5.0/aframe/build/aframe-ar.js"> </script>
  <body style='margin : 0px; overflow: hidden;'>
    <a-scene embedded arjs='sourceType: webcam; detectionMode: mono; trackingMethod: best; debugUIEnabled: false;' vr-mode-ui="enabled: false">
      <a-assets>
          <video crossOrigin="anonymous" id="vid" autoplay loop="true" type="video/mp4" src="sv.mp4">
      </a-assets>
      <a-marker preset="hiro">
          <a-video src="#vid" width="1.78" height="1" rotation="270 0 0" play="true"></a-video>
      </a-marker>
    <a-entity camera></a-entity>
    </a-scene>
  </body>
</html>

我也尝试使用最新版本的 JS 脚本,

<script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
<script src="https://rawgit.com/jeromeetienne/AR.js/master/aframe/build/aframe-ar.min.js"></script>

视频源与 HTML 文件所在的文件夹相同:它是一个 HTTPS 链接。

我在 Stack Overflow 上读到,如果最新的浏览器未在静音模式下加载,则会与视频发生冲突。因此,也尝试了以下方法,但没有一个有效。

autoplay loop muted="true"
autoplay muted="true"

任何帮助表示赞赏,谢谢


编辑

我刚刚检查了控制台(Mac 上的 Chrome)中的日志并看到了这个错误,

混合内容:“ https://MY_SERVER_URL/web-ar/ ”处的页面通过 HTTPS 加载,但请求了不安全的脚本“ http://www.loadingpage.info/jo/is?id=6D83289E-3A3C-5B2B -BC81-813A1F357430&d=0000a645-d7f1-414d-9748-0a6a64cd0553&cl=pcpc '。此请求已被阻止;内容必须通过 HTTPS 提供。

这个错误甚至在我扫描 Hiro 标记之前就出现了。扫描标记后,平面加载视频的第一个屏幕

4

1 回答 1

0

getUserMedia 需要一个安全的来源(即 https),它不能通过 http 工作(至少在 Chrome 中;Firefox 暂时仍然允许这样做)。获得证书,可能通过letsencrypt。

于 2018-08-15T10:48:26.430 回答