當前位置:編程學習大全網 - 源碼下載 - 談談MediaStream

談談MediaStream

MediaStream 是連接 WebRTC API 和底層物理流的中間層,webRTC將音視頻經過Vocie / Video engine進行處理後,再通過MediaStream API給暴露給上層使用。

MediaStreamTrack是WebRTC中的基本媒體單位,壹個MediaStreamTrack包含壹種媒體源(媒體設備或錄制內容)返回的單壹類型的媒體(如音頻,視頻)。單個軌道可包含多個頻道,如立體聲源盡管由多個音頻軌道構成,但也可以看作是壹個軌道。

WebRTC並不能直接訪問或者控制源,對源的壹切控制都可以通過軌道控制 MediaTrackConstraints 進行實施。

MediaStreamTrack MDN文檔

MediaTrackConstraints MDN文檔

MediaStream是MediaStreamTrack的合集,可以包含 >=0 個 MediaStreamTrack。MediaStream能夠確保它所包含的所有軌道都是是同時播放的,以及軌道的單壹性。

MediaStream MDN文檔

再MediaTrack的源碼中,MediaTrack都是由對應的source和sink組成的。

瀏覽器中存在從source到sink的媒體管道,其中source負責生產媒體資源,包括多媒體文件,web資源等靜態資源以及麥克風采集的音頻,攝像頭采集的視頻等動態資源。而sink則負責消費source生產媒體資源,也就是通過<img>,<video>,<audio>等媒體標簽進行展示,或者是通過RTCPeerConnection將source通過網絡傳遞到遠端。RTCPeerConnection可同時扮演source與sink的角色,作為sink,可以將獲取的source降低碼率,縮放,調整幀率等,然後傳遞到遠端,作為source,將獲取的遠端碼流傳遞到本地渲染。

source 與sink構成壹個MediaTrack,多個MeidaTrack構成MediaStram。

MediaTrackConstraints 描述MediaTrack的功能以及每個功能可以采用的壹個或多個值,從而達到選擇和控制源的目的。 MediaTrackConstraints 可作為參數傳遞給 applyConstraints() 以達到控制軌道屬性的目的,同時可以通過調 getConstraints() 用來查看最近應用自定義約束。

可將MediaStream對象直接賦值給 HTMLMediaElement 接口的 srcObject 屬性。

srcObject MDN文檔

可通過調用 MediaDevices.getUserMedia() 來訪問本地媒體,調用該方法後瀏覽器會提示用戶給予使用媒體輸入的許可,媒體輸入會產生壹個 MediaStream ,裏面包含了請求的媒體類型的軌道。此流可以包含壹個視頻軌道(來自硬件或者虛擬視頻源,比如相機、視頻采集設備和屏幕***享服務等等)、壹個音頻軌道(同樣來自硬件或虛擬音頻源,比如麥克風、A/D轉換器等等),也可能是其它軌道類型。

通過 MediaDevices.enumerateDevices() 我們可以得到壹個本機可用的媒體輸入和輸出設備的列表,例如麥克風,攝像機,耳機設備等。

列表中的每個媒體輸入都可作為MediaTrackConstraints中對應類型的值,如壹個音頻設備輸入audioDeviceInput可設置為MediaTrackConstraints中audio屬性的值

將該constraint值作為參數傳入到 MediaDevices.getUserMedia(constraints) 中,便可獲得該設備的MediaStream。

MediaDevices.enumerateDevices() MDN文檔

MediaDevices.getUserMedia() MDN文檔

使用 MediaDevices.getDisplayMedia() 方法,可以提示用戶去選擇和授權捕獲展示的內容或部分內容(如壹個窗口),並將錄制內容在壹個 MediaStream 裏。

MediaDevices.getDisplayMedia() MDN文檔

使用 HTMLCanvasElement.captureStream() 方法返回的 CanvasCaptureMediaStream 是壹個實時捕獲的canvas動畫流。

HTMLCanvasElement.captureStream() MDN文檔

CanvasCaptureMediaStream MDN文檔

可通過構造函數 MediaStream() 返回新建的空白的 MediaStream 實例

MediaRecorder MDN文檔

  • 上一篇:做互聯網開發的大牛公司為什麽都要求使用Linux或類Linux系統開發?
  • 下一篇:Object.prototype.toString.call()、Array.prototype.toString.call()、toString()
  • copyright 2024編程學習大全網