Limited support 一部のブラウザのみ対応。使用時はサポート状況を確認すること。

captureStream() for <audio> and <video>

captureStream() は HTMLMediaElement インターフェイスのプロパティで、このメディア要素でレンダリングされているコンテンツのリアルタイムキャプチャをストリーミングしている MediaStream オブジェクトを返します。

これは、例えば WebRTC の RTCPeerConnection のソースとして使用できます。

メディア

対応ブラウザ

機能 デスクトップ モバイル
Chrome
Edge
Firefox
Safari
Chrome Android
Safari iOS
captureStream
62
79
149
62
1+対応 (バージョン) 未対応 ※注釈あり サブ機能の解説は MDN Web Docs (CC BY-SA 2.5)
注釈 8件
対応条件
  • ベンダープレフィックス付きで対応: moz (149)
  • ベンダープレフィックス付きで対応: moz (15)
制限事項
  • このブラウザでは部分的にしか実装されていません
削除済み
  • このバージョンで機能が削除されました (149)
実装メモ
  • Firefox 51 以降、キャプチャ開始後に `MediaStream` からソースを変更した場合、ソースを `MediaStream` に戻すまでキャプチャしたストリームデータを更新できない。
  • Firefox 51 から、`MediaStream` ソースを持つメディア要素で `mozCaptureMediaStream()` を呼び出した場合、返されるオブジェクトには、その要素が `MediaStream` を再生している間のトラックのみが含まれます。
  • Firefox 51 以降、ソースメディアを持たないメディア要素で `mozCaptureMediaStream()` が呼び出された場合、その互換性モードは最初に追加されたソースを基準とします。
  • Firefox 51 より前のバージョンでは、`mozCaptureMediaStream()` は `MediaStream` をソースとするメディア要素 (`RTCPeerConnection` で受信したストリームを提示する `<video>` 要素など) では使用できませんでした。

基本構文

JAVASCRIPT 
captureStream()

実務での使いどころ

  • captureStream() for <audio> and <video> の活用

    captureStream() は HTMLMediaElement インターフェイスのプロパティで、このメディア要素でレンダリングされているコンテンツのリアルタイムキャプチャをストリーミングしている MediaStream オブジェクトを返します。

注意点

  • 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。

実装メモ

  • 一部の API はセキュアコンテキスト (HTTPS) やユーザー操作起点を必要とする。利用前に要件を確認すること。

参考リンク