如何启用浏览器进行相机访问

How to enable the browser for camera access?

本文关键字：相机 访问 浏览器 何启用 启用      更新时间：2023-09-26

嗨，目前我正在使用Chrome浏览器的相机API。但是我的浏览器不支持navigation.getUserMedia。

嗨，为此分享一些代码。

这是我的网页：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>getUserMedi</title>
<link rel="stylesheet" href="style.css">
 </head>
 <body>
 <div id="video-container">
  <video id="camera-stream" width="500" autoplay></video>
  </div>
  <script src="camera.js">
  </script>
  </body>
  </html>

现在我的CSS文件在这里：

  body {
  background: #F7F7F7;
  margin: 0;
  padding: 0;
        }
   #video-container {
   margin: 2em auto 0;
   width: 500px;
   padding: 2em;
   background: white;
   -webkit-box-shadow: 0 1px 10px #D9D9D9;
   -moz-box-shadow: 0 1px 10px #D9D9D9;
   -ms-box-shadow: 0 1px 10px #D9D9D9;
   -o-box-shadow: 0 1px 10px #D9D9D9;
   box-shadow: 0 1px 10px #D9D9D9;
        }

这里相机.js文件：

    window.onload = function() {
    // Normalize the various vendor prefixed versions of getUserMedia.
   navigator.getUserMedia = (navigator.getUserMedia ||
   navigator.webkitGetUserMedia ||
   navigator.mozGetUserMedia || 
   navigator.msGetUserMedia);
   if (navigator.getUserMedia) {
  // Request the camera.
   navigator.getUserMedia(
    // Constraints
    {
    video: true
    },
    // Success Callback
    function(localMediaStream) {
     // Get a reference to the video element on the page.
    var vid = document.getElementById('camera-stream');
    // Create an object URL for the video stream and use this 
    // to set the video source.
    vid.src = window.URL.createObjectURL(localMediaStream);
                 },
         // Error Callback
    function(err) {
    // Log the error to the console.
    console.log('The following error occurred when trying to use  
     getUserMedia: ' + err);           
              }
           );
        } else {
        alert('Sorry, your browser does not support getUserMedia');
            }
            };

在这里，我的相机无法打开。和浏览器也不支持请澄清这个家伙的。

首先，navigation.getUserMedia已被弃用，并且不再被大多数浏览器支持。

Mozilla.org 网站上找到的新推荐 API 是navigator.mediaDevices.getUserMedia

请，您可以通过下面的URL阅读更多信息。

媒体设备

用于相机访问的 API

相关文章：