一旦進入虛擬現實模式A相框，攝像頭飼料變黑色

Question

這裏是我的代碼如下，我是相當新的使用一個框架，這是非常有趣的，我似乎無法解決爲什麼我有問題，更有經驗的人可以幫我嗎？

var errorCallback = function(e) { 
 
    console.log('Not working!', e); 
 
}; 
 

 
navigator.getUserMedia({ 
 
    video: true, 
 
    audio: true 
 
}, function(localMediaStream) { 
 
    var video = document.querySelector('video'); 
 
    video.src = window.URL.createObjectURL(localMediaStream); 
 

 

 
    video.onloadedmetadata = function(e) { 
 
    // Ready to go. Do some stuff. 
 
    }; 
 
}, errorCallback);

video { 
 
    width: 100% !important; 
 
    max-width: 100% !important; 
 
    height: auto !important; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    z-index: -1000; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/aframe/0.5.0/aframe.min.js"></script> 
 

 

 
<video autoplay></video> 
 
<a-scene> 
 
    <a-box color="red" rotation="0 45 45" scale="2 2 2"></a-box> 
 
    <a-entity position="0 0 3.8"> 
 
    <a-camera> 
 
    </a-camera> 
 
    </a-entity> 
 
    <a-sky opacity="0"></a-sky> 
 
</a-scene>

相機工作時，你是不是在VR模式，但是當你做一個幀進入VR模式，背景變成了黑色，而不是顯示相機飼料。有誰知道爲什麼？我以前在其他網站上尋求過幫助，但沒有提供幫助。

Answer 1

從我看到你創建一個<video>元素OVER aframe畫布。進入vr模式時，您只能看到aframe畫布，這就是您的100％/ 100％視頻可能消失的原因。

我認爲你應該製作一個<a-video>元素，並將「src」設置爲localMediaStream。此外，你需要一個物體來紋理你的視頻。
不知道它是否會採取它，但從未嘗試過。你應該看看https://github.com/jeromeetienne/AR.js/

順便說一句，似乎你的方法是相當不贊成： https://developer.mozilla.org/pl/docs/Web/API/Navigator/getUserMedia
看來你現在應該使用navigator.mediaDevices.getUserMedia（）： https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia

更新：我做了一個小使用我的相機提要紋理飛機的筆，在Firefox上嘗試過，效果很好，我的Chrome瀏覽器似乎在plunker或codepen中調用時禁用了userMedia。似乎在我的電腦上的VRMODE和android的firefox上工作。我的手機在飛機上是歪的4某種原因，我想它有一個低劣的攝像頭和無記憶：對

隨意修改我的筆： https://codepen.io/gftruj/pen/jwEyQN

CSS的部分是吃剩的，更好的確保視頻Feed具有兩個維度的權力。正如我在aframe網站上看到的那樣，我應該將視頻放在<a-video>元素內：https://aframe.io/docs/0.5.0/primitives/a-video.html，但將其作爲<a-plane> src似乎工作正常。