2016-12-13 168 views
0

我決定學習WebRTC,但沒有顯示視頻。請幫助。 我在做什麼錯?使用Chrome 我的代碼:WebRTC。不顯示視頻

<html> 

<head> 
    <meta charset="UTF-8"> 
</head> 

<body> 
    <script> 
     window.onload = function() { 
      navigator.webkitGetUserMedia({ video: true }, getStream, noStream); 
     }; 

     function getStream(stream) { 
      var url = window.webkitURL.createObjectURL(stream);    
      var video = document.getElementById('video'); 
      video.src = url; 
     } 

     function noStream(faild) { 

     } 
    </script> 
    <video id="video" autoplay="autoplay" width="400"></video> 
</body> 

</html> 
+2

這並不真的有什麼關係的WebRTC。無論如何,我不知道這是你的問題,但你的代碼是過時的。考慮使用MediaDevices API以及adapter.js來刷新較舊的瀏覽器。 https://github.com/webrtc/adapter https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia – Brad

+0

同樣https://webrtc.github.io/samples/src/ content/getusermedia/gum /顯示使用getUserMedia的最新示例。 您可能還想考慮將日誌記錄添加到稱爲「noStream」的錯誤回調中。有一個理由,你稱之爲「faild」在那裏,它有助於找出哪裏出了問題 –

+0

@Brad謝謝,它工作 –

回答

1

工作代碼:

<head> 
    <meta charset="UTF-8"></script> 
</head> 

<body> 
    <script> 
     window.onload = function() { 
      var constraints = { audio: true, video: { width: 1280, height: 720 } }; 

navigator.mediaDevices.getUserMedia(constraints) 
.then(function(mediaStream) { 
    var video = document.querySelector('video'); 
    video.srcObject = mediaStream; 
    video.onloadedmetadata = function(e) { 
    video.play(); 
    }; 
}) 
.catch(function(err) { console.log(err.name + ": " + err.message); }); 
     }; 
    </script> 
    <video id="video" autoplay="autoplay" width="400"></video> 
</body> 

</html>