Menu
I am writing the following code for starting my camera and watch my video on the Google Chrome browser using the technology webRTC. There are two files I have created index.html and client.js. I have attached the code of both. Node.js server is installed on my PC. The problem is my camera is switching on but I am unable to see the video streaming.
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>
628
asked Nov 16 '25 01:11
It seems you are using old code, now API's got changed better get started with latest API.
See Demo and Source
Try below snippet in your 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);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
