How to solve the problem of browser calling camera in javascript
This article is to share with you about how to solve the problem of browser calling camera in javascript. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.
The browser uses webrtc to call the camera.
If (navigator.mediaDevices&&navigator.mediaDevices.getUserMedia) {
Navigator.mediaDevices.getUserMedia ({
'audio':true
'video': {facingMode:'user'} / / facingMode: {exact: "environment"} call the rear camera
}) .then (function (mediaStream) {
GetVideoStream (mediaStream)
}) .catch (function (error) {
Console.log (error)
Parent.layer.msg ('disabled permission detected, please refresh the page and try again', {
Area: ['20%, 8%, 8%]
Offset: ['46%, 40%, 40%]
})
})
} elseif (navigator.getUserMedia) {
Navigator.getUserMedia ({
'video':true
'audio':true
}, getVideoStream)
} else {
Parent.layer.msg ('this browser does not support calling camera', {
Area: ['20%, 8%, 8%]
Offset: ['46%, 40%, 40%]
})
}
How do browsers call the camera?
But I tested it on Huawei Android, also using a chrome browser, but using a front-facing camera.
Can it be said that the front and rear cameras of Android and win10 are opposite?
I changed {facingMode:'user'} to facingMode: {exact: "environment"} (standard is called rear camera, but actually front on tablet)
Chrome pop-up detection permission is disabled (this is the effect of my layer), the actual error is OverconstrainedError, Baidu, all said that do not limit width, height and so on, but I did not set these things ah.
When I tested it on the Edge browser, everything was normal. {facingMode:'user'} called the front or front, and facingMode: {exact: "environment"} called the rear, just like Android, which ruled out the conclusion that the front and rear cameras of Android and win10 are opposite!
Thank you for reading! This is the end of the article on "how to solve the problem of browser calling camera in javascript". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!