如果您使用 getUserMedia()
或 WebRTC,可能需要調整 Chrome 45 以上版本的程式碼。
MediaStream API 代表媒體的同步串流。舉例來說,從相機和麥克風輸入取得的串流會同步處理影片和音訊軌道。每個音軌都由 MediaStreamTrack 代表。(請勿與 <track> 元素混淆)。
Chrome 45 中淘汰了三個 MediaStream
:
MediaStream.ended
MediaStream.label
MediaStream.stop()
並行處理有兩種新增方式:
MediaStream.active
MediaStreamTrack.stop()
這類變更需要進行以下調整:
- 請使用
MediaStream.active
檢查MediaStream
是否正在串流,而非MediaStream.ended
。 - 請使用
MediaStreamTrack.stop()
停止串流播放,而非MediaStream.stop()
。 - 如果您需要
MediaStream
的專屬 ID,請使用MediaStream.id
而非MediaStream.label
。MediaStreamTrack.label
會為串流來源裝置提供人類可讀的名稱,例如「FaceTime HD Camera (Built-in) (05ac:8510)」。
您可以透過以下方式查看這些功能的運作情形:在 Chrome (搭載相機的裝置) 中開啟 simpl.info/gum,然後查看 Chrome 開發人員工具主控台。在這個示範中,傳遞至 getUserMedia()
回呼的 MediaStream 物件 stream
位於全域範圍,因此您可以透過主控台檢查該物件。呼叫 stream.getTracks()[0]
即可查看此串流的 MediaStreamTrack
。
Stop()、已結束和處於活動狀態
Media Capture and Streams W3C 工作小組在研究將新音軌新增至 MediaStream
時會發生什麼問題,以及空白 MediaStream
是否會結束時,發現在 MediaStream
上實作 ended
並無合理方法 (例如「永遠不會再次開始」)。在 HTML5 的其他部分,「已結束」代表「已結束且永遠不會恢復」。「有效」則沒有這種含意:無效的串流可以再次變為有效,例如在其中加入新曲目時。工作小組決定移除這項功能,以免造成混淆。
以下是如何使用「MediaStream.active」檢查串流狀態的範例:
var gumStream;
navigator.getUserMedia({audio: false, video: true},
function(stream) {
gumStream = stream;
// ...
},
function(error) {
console.log('getUserMedia() error', error);
});
// …
if (gumStream.active) {
// do something with the stream
}
從 MediaStream
中移除 stop()
並不會移除任何實際功能:解除來源裝置的程序等,都必須在 MediaStreamTrack
上執行。請改用 stop()
取代 MediaStreamTrack
:
navigator.getUserMedia({audio: false, video: true},
function(stream) {
// can also use getAudioTracks() or getVideoTracks()
var track = stream.getTracks()[0]; // if only one media track
// ...
track.stop();
},
function(error){
console.log('getUserMedia() error', error);
});
標籤
結果發現,沒有人能完全瞭解這項屬性的用途!
MediaStream.label
已新增至規格的第一個版本,但沒有人真正知道 label
的用途。當透過 RTCPeerConnection
傳送串流時,label
會發生什麼情況,目前也無法確定。
W3C 工作小組詢問後發現沒有人想要這個功能,因此將其移除。
重申一遍:MediaStream.id
會提供 MediaStream
的專屬 ID,而 MediaStreamTrack.label
會提供串流來源的名稱,例如相機或麥克風的類型。
如要進一步瞭解 MediaStream
和 MediaStreamTrack
,請前往 Mozilla Developer Network 參閱相關資訊,HTML5 Rocks 也提供 錄製音訊和影片的 getUserMedia()
相關資訊。
一如既往,我們非常重視你對 Chrome 變更的意見回饋。您可以追蹤這些淘汰項目的錯誤 (這裡和這裡),並在意圖實作中查看更多討論和詳細資訊。