2

我正在尝试构建一个model-viewer使用简单框对象的演示。它在 iOS/Safari 上运行良好,但我无法让它在 Android 上运行。在Android上,它不会激活相机,只是在空白处显示模型,模型可以移动。我尝试过使用多种模型,包括我从互联网上提取的模型,它们都在工作演示中。这是完整的 HTML

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="styles.css">
  <script src="https://unpkg.com/@webcomponents/webcomponentsjs@2.1.3/webcomponents-loader.js"></script>
  <script src="https://unpkg.com/intersection-observer@0.5.1/intersection-observer.js"></script>
  <script src="https://unpkg.com/resize-observer-polyfill@1.5.0/dist/ResizeObserver.js"></script>
  <script src="https://unpkg.com/fullscreen-polyfill@1.0.2/dist/fullscreen.polyfill.js"></script>
  <script src="https://unpkg.com/@magicleap/prismatic/prismatic.min.js"></script>
  <script src="https://unpkg.com/focus-visible@5.0.2/dist/focus-visible.js" defer></script>
  <title>Model Viewer Demo</title>
</head>
<body>
  <h1>WebAR Demo</h1>
  <p>A Basic demo of WebAR using Google's model-viewer component.</p>
  <div id="card">
    <model-viewer alt="its just a box" 
      src="assets/BoxTest.glb" 
      ios-src="assets/BoxTest.usdz" 
      background-color="#afe" 
      shadow-intensity="1" 
      camera-controls 
      interaction-prompt="auto" 
      ar 
      quick-look-browsers="safari chrome">
    </model-viewer>
  </div>
  <script type="module" src="https://unpkg.com/@google/model-viewer@v0.6.2/dist/model-viewer.js">
  </script>
  <script nomodule src="https://unpkg.com/@google/model-viewer@v0.6.2/dist/model-viewer-legacy.js">
  </script>
</body>
</html>

我完全不知道为什么它不起作用以及接下来我需要尝试什么。

4

1 回答 1

1

原来我正在使用 simpleHTTPServer 来服务它,并且由于某种原因它是问题的原因。我认为它不支持 gltf 文件的 MIME 类型。

于 2019-10-01T15:45:05.707 回答