我正在尝试让 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>