2017-05-31 13 views
1

次のコードを記述して、WebRTCテクノロジを使用してカメラを起動し、Google Chromeブラウザで自分の動画を見ています。 index.htmlとclient.jsを作成したファイルは2つあります。私は両方のコードを添付しました。 Node.jsサーバーが私のPCにインストールされています。問題は私のカメラのスイッチがオンになっていますが、ビデオストリーミングが見えません。webRTCを使用してビデオストリーミングを開始するにはどうすればよいですか?

client.js

function hasUserMedia() { 
    //check if the browser supports the WebRTC 
    return !!(navigator.getUserMedia || navigator.webkitGetUserMedia || 
     navigator.mozGetUserMedia); 
} 

if (hasUserMedia()) { 
    navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia 
     || navigator.mozGetUserMedia; 

    //enabling video and audio channels 
    navigator.getUserMedia({ video: true, audio: true }, function (stream) { 
     var video = document.querySelector('video'); 

     //inserting our stream to the video tag  
     video.src = window.URL.createObjectURL(stream); 
    }, function (err) {}); 
} else { 
    alert("WebRTC is not supported"); 
}` 

index.htmlを

<!DOCTYPE html> 
<html lang = "en"> 

    <head> 
     <meta charset = "utf-8" /> 
     <link rel="stylesheet" href="css/main.css" /> 
    </head> 

    <body> 
     <video autoplay></video> 
     <script src = "js/client.js"></script>  
    </body> 
    </html> 
+0

スニペット以下試してみてくださいを参照してください。 41260985/getusermedia-without-ssl-for-local-storage) – jib

+0

Chromeにはhttpsが必要です。 Firefoxでも動作するはずです。また、答えに言及すると、本当に古いコードをいくつかコピーしています。 – jib

答えて

1

あなたが今、APIの最新のAPIを使い始めるよりよく変えてしまった、古いコードを使用しているようです。

DemoSource

はhttps://stackoverflow.com/questions/([ローカルストレージのためのSSLなしgetUserMedia()]の可能性のある重複あなたclient.jsに

var constraints = { audio: true, video: true}; 
navigator.mediaDevices.getUserMedia(constraints).then(function(stream) { 
    var video = document.querySelector('video'); 
    video.srcObject = stream; 
}).catch(function(err) { 
    console.log('Error in getting stream', err); 
}); 
関連する問題