I'm using getUserMedia to make a website that can display a camera stream. The problem is, my code works on computer, but not through a mobile browser. Does anyone know why? (requesting camera access doesn't even pop up)
<!DOCTYPE html>
<html>
<style>
left {
margin: 0px;
}
right {
margin: 1000px;
}
</style>
<body>
<div id="left">
<video autoplay="true" id="videoElement"></video>
</div>
<div id="right">
<video autoplay="true" id="videoElement1"></video>
</div>
<script>
var video = document.querySelector("#videoElement");
var video1 = document.querySelector("#videoElement1");
if (navigator.mediaDevices.getUserMedia) {
navigator.mediaDevices.getUserMedia({video:true})
.then(function (stream) {
video.srcObject = stream;
video1.srcObject = stream;
})
.catch(function (err0r) {
console.log("Something went wrong!");
});
}
</script>
</body>
</html>