Navigator: getUserMedia() 方法

已弃用：此特性不再推荐。虽然某些浏览器可能仍然支持它，但它可能已经从相关的网络标准中删除，可能正在删除过程中，或者可能仅为兼容性目的而保留。请避免使用它，如果可能，请更新现有代码；请参阅本页底部的兼容性表格以指导您的决策。请注意，此特性可能随时停止工作。

安全上下文： 此功能仅在安全上下文（HTTPS）中可用，且支持此功能的浏览器数量有限。

已废弃的 Navigator.getUserMedia() 方法会提示用户授予权限，以使用最多一个视频输入设备（如摄像头或共享屏幕）和最多一个音频输入设备（如麦克风）作为 MediaStream 的源。

如果授予权限，一个包含来自这些设备的视频和/或音频轨道的 MediaStream 会被传递给指定的成功回调函数。如果拒绝权限、不存在兼容的输入设备或发生其他错误，则会调用错误回调函数，并提供一个描述错误的对象的参数。如果用户根本不做出选择，则不会执行任何回调函数。

注意： 这是一个旧版方法。请改用新的 navigator.mediaDevices.getUserMedia()。虽然技术上并未废弃，但此旧的基于回调的版本被标记为已废弃，因为规范强烈建议使用新的返回 Promise 的版本。

语法

getUserMedia(constraints, successCallback, errorCallback)

参数

constraints

一个对象，用于指定请求的媒体类型以及每种类型的任何要求。有关详细信息，请参阅现代 MediaDevices.getUserMedia() 方法下的 constraints 部分，以及文章 Capabilities, constraints, and settings。

successCallback

一个函数，在媒体访问请求被批准时调用。该函数接收一个参数：包含媒体流的 MediaStream 对象。您的回调函数随后可以将该流分配给所需的元素（如 <audio> 或 <video> 元素），如下面的示例所示。

function successCallback(stream) {
  const video = document.querySelector("video");
  video.srcObject = stream;
  video.onloadedmetadata = (e) => {
    // Do something with the video here.
  };
}

errorCallback

当调用失败时，会在 errorCallback 中指定的函数会被调用，并传递一个对象作为其唯一参数；该对象基于 DOMException。

navigator.getUserMedia =
  navigator.getUserMedia ||
  navigator.webkitGetUserMedia ||
  navigator.mozGetUserMedia;

if (navigator.getUserMedia) {
  navigator.getUserMedia(
    { audio: true, video: { width: 1280, height: 720 } },
    (stream) => {
      const video = document.querySelector("video");
      video.srcObject = stream;
      video.onloadedmetadata = (e) => {
        video.play();
      };
    },
    (err) => {
      console.error(`The following error occurred: ${err.name}`);
    },
  );
} else {
  console.log("getUserMedia not supported");
}