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");
}