Get to know MDN better
このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。
WebRTC (Web Real-Time Communication、ウェブリアルタイムコミュニケーション) は、ウェブアプリケーションやウェブサイトにて、仲介を必要とせずにブラウザー間で直接、任意のデータの交換や、キャプチャした音声/映像ストリームの送受信を可能にする技術です。 WebRTC に関する一連の標準規格は、ユーザーがプラグインやサードパーティ製ソフトウェアをインストールすることなく、ピアーツーピアーにて、データ共有や遠隔会議を実現することを可能にします。
WebRTC は、相互に関連したいくつかの API とプロトコルで構成されており、これらが連携してこれを実現しています。ここで紹介するドキュメントでは、WebRTC の基礎知識、データ接続とメディア接続、両方の設定方法と、使用方法などを理解するのに役立ちます。
WebRTC は複数の目的に対応しています。メディアキャプチャとストリーム API と一緒に使用することで、音声・ビデオ会議、ファイル交換、画面共有、ID 管理、DTMF (タッチトーンダイヤル信号) の送信サポートを含む旧来の電話システムとのインターフェイスなど、強力なマルチメディア機能をウェブに提供します。ピアー間の接続は、特別なドライバーやプラグインを必要とせずに行うことができ、多くの場合、中間サーバーを介さずに行うことができます。
2 つのピアー間の接続は RTCPeerConnection インターフェイスで表現されます。接続が確立され、RTCPeerConnection を使用して開かれると、メディアストリーム (MediaStream) やデータチャンネル (RTCDataChannel) を接続に追加することができます。
メディアストリームは、メディア情報の任意の数のトラックで構成することができます。トラックは、MediaStreamTrack インターフェイスに基づいたオブジェクトで表され、音声、映像、テキスト(字幕やチャプター名など)を含むメディアデータのいくつかの型のうちの 1 つを含むことができます。ほとんどのストリームは少なくとも 1 つの音声トラックと映像トラックで構成されており、ライブメディアや保存されたメディア情報(ストリーミングされた動画など)の送受信に使用することができます。
また、2 つのピアー間の接続を使用して、RTCDataChannel インターフェイスを使用して任意のバイナリーデータを交換することもできます。これは、バックチャンネル情報、メタデータ交換、ゲームステータスパケット、ファイル転送、あるいはデータ転送のためのプライマリーチャンネルとして使用することができます。
WebRTC は現行のブラウザーでは概ね対応していますが、一部非互換性も残っています。 adapter.js ライブラリーは、これらの非互換性からアプリを保護するための補助的なものです。
WebRTC は、様々なタスクを達成するために連携して動作する複数のインターフェイスを提供しているため、以下のリストのインターフェイスをカテゴリー別に分けています。アルファベット順のリストはサイドバーをご覧ください。
以下のインターフェイス、辞書、型は、WebRTC 接続のセットアップ、オープン、管理に使用します。これには、ピアーメディア接続、データチャネルおよび、それぞれのピアーが双方向メディア接続のために最適な設定を選択する機能に関する情報をやりとりするためのインターフェイスが含まれています。
ローカルコンピュータとリモートピアー間の WebRTC 接続を表します。これは、 2 つのピアー間のデータの効率的なストリーミングを処理するために使用されます。
RTCDataChannel接続の 2 つのピアー間の双方向データチャネルを表します。
RTCDataChannelEventRTCDataChannel を RTCPeerConnection に装着している間に発生するイベントを表します。このインターフェイスで送信されるイベントは、データチャネル datachannel のみです。
RTCSessionDescriptionセッションの引数を表します。各 RTCSessionDescription は、オファー/アンサーネゴシエーションプロセスの、どの部分を記述するかを示す記述型 (type) と、セッションの SDP 記述子で構成されます。
RTCStatsReport接続または接続上の個々のトラックの統計情報の詳細を提供します。RTCPeerConnection.getStats() を呼び出すと報告を取得できます。
RTCIceCandidateRTCPeerConnection を確立するための ICE(インタラクティブ接続確立) サーバーの候補を表します。
RTCIceTransportICE トランスポートに関する情報を表します。
RTCPeerConnectionIceEventターゲットとの ICE 候補 (通常は RTCPeerConnection) に関連して発生するイベントを表します。この型のイベントは icecandidate 1 つだけです。
RTCRtpSenderRTCPeerConnection 上の MediaStreamTrack のデータのエンコードと送信を管理します。
RTCRtpReceiverRTCPeerConnection 上の MediaStreamTrack のデータの受信とデコードを管理します。
RTCTrackEventこのインターフェイスは track イベントを表すもので、 RTCRtpReceiver オブジェクトが RTCPeerConnection オブジェクトに追加されたことを示すトラックイベントを表現するために使用されるインターフェイスで、新しい着信 (incoming) MediaStreamTrack が生成され、 RTCPeerConnection に追加されたことを示します。
RTCSctpTransportStream Control Transmission Protocol (SCTP) トランスポートを説明する情報を提供し、 RTCPeerConnection のすべてのRTCPeerConnection のデータチャネルの SCTP パケットが送受信される Datagram Transport Layer Security (DTLS) トランスポートにアクセスする方法も提供します。
データチャネルの bufferedAmount プロパティで示される、現在バッファリングされているデータ量が、 bufferedAmountLowThreshold で指定されたチャンネルの最小バッファリングデータサイズ以下に減少したときに発行されます。
closeデータチャネルを閉じる処理が完了し、現在 closed の状態です。この点で、基礎となるデータトランスポートは完全に閉じられています。 closing イベントを監視することで、閉じる処理が完了する前に通知を受けることができます。
closingRTCDataChannel が closing 状態に遷移し、まもなく閉じられることが示された。 close イベントを監視することで、閉じる処理の完了を検出することができます。
connectionstatechangeconnectionState でアクセスできる接続の状態が変更された。
datachannelリモートピアーが新しいデータチャネルを開いた後、新しい RTCDataChannel が利用可能です。このイベント型は RTCDataChannel です。
errorRTCErrorEvent で、データチャネルでエラーが発生したことを示します。
errorRTCErrorEvent で、 RTCDtlsTransport においてエラーが発生したことを示します。このエラーは dtls-failure または fingerprint-failure のどちらかになります。
gatheringstatechangeRTCIceTransport の収集状態が変更されました。
icecandidateRTCPeerConnectionIceEvent は、ローカルデバイスがローカルピアーに追加する必要がある新しい ICE 候補を特定したときに、 setLocalDescription()を呼び出して送信されるものです。
icecandidateerrorICE 候補の収集中にエラーが発生したことを示すRTCPeerConnectionIceErrorEvent。
iceconnectionstatechangeICE 接続の状態(iceconnectionstate プロパティで得られる)が変化したときに RTCPeerConnection に送られます。
icegatheringstatechangeICEの収集状態(icegatheringstate プロパティで得られる)が変化したときに RTCPeerConnection に送られます。
messageデータチャネルでメッセージを受信した。このイベントの型は MessageEvent です。
negotiationneededdomxref("RTCPeerConnection.createOffer", "createOffer()")}} に続いて setLocalDescription() を呼び出し、RTCPeerConnectionにセッション交渉を行う必要があることを通知します。
openRTCDataChannel の基礎となるデータトランスポートが正常にオープンまたは再オープンされました。
selectedcandidatepairchangeイベントが発行された RTCIceTransport において、現在選択されている ICE 候補のペアが変更されました。
tracktrack イベントは RTCTrackevent の型で、メディアのストリーミングの交渉が成功した後に新しいトラックが接続に追加されると RTCPeerConnection に送信されます。
signalingstatechangeピアー接続の signalingstate が変更されたときに送信されます。これは setLocalDescription() または setRemoteDescription() のいずれかが呼び出された結果発生するものです。
statechangeRTCDtlsTransport の状態が変化した。
statechangeRTCIceTransport の状態が変化した。
statechangeRTCSctpTransport の状態が変化した。
rtctransformエンコードされた動画や音声のフレームは、ワーカーで変換ストリームを使用して処理する準備ができています。
RTCSctpTransport インスタンスの状態を示します。
これらの API は、セキュリティとアイデンティティを管理し、ユーザーの接続を認証するために使われます。
RTCIdentityProviderユーザーエージェントが ID アサーションの生成または検証を要求できるようにします。
RTCIdentityAssertion現在の接続のリモートピアーの ID を表します。まだピアーが設定されておらず、検証されていない場合、このインターフェイスは null を返します。一度設定すると変更することはできません。
RTCIdentityProviderRegistrarID プロバイダー (idP) を登録します。
RTCCertificateRTCPeerConnection が認証に使用する証明書を表します。
これらのインターフェイスとイベントは、公衆交換電話網 (PSTN) との相互作用に関連するものです。これらは主に、トーンダイヤルの音、またはその音を表すパケットをネットワーク経由でリモートピアーに送信するために使用されます。
RTCPeerConnection のデュアルトーン多周波 (DTMF) シグナリングのエンコーディングと送信を管理します。
RTCDTMFToneChangeEventDTMF トーンの開始または終了を示すために tonechange イベントで使用されます。このイベントは(特に明記されている場合を除き)バブリングせず、(特に明記されている場合を除き)キャンセルもできません。
新しい DTMF トーンが接続上で再生され始めたか、 RTCDTMFSender の toneBuffer にある最後のトーンが送信されてバッファが空になったか、どちらかです。このイベントの型は RTCDTMFToneChangeEvent です。
これらのインターフェイスとイベントは、ワーカーで実行する変換ストリームを使用して、入出力されるエンコード方式の動画と音声フレームを処理するために使用します。
ワーカーで実行する変換ストリームを RTC パイプラインに挿入するインターフェイスです。
RTCRtpScriptTransformerメインスレッドからオプションを渡す RTCRtpScriptTransform に対応するワーカーサイドのもので、 TransformStream を通してエンコードされたフレームをパイプするために使用することができる読み取り可能なストリームと書き込み可能なストリームも一緒に渡します。
RTCEncodedVideoFrameRTC パイプラインで変換されるエンコードされた動画フレームを表します。
RTCEncodedAudioFrameRTC パイプラインで変換されるエンコードされた音声フレームを表します。
エンコードされた映像および音声フレームが受信パイプラインに変換ストリームを挿入するために使用するプロパティです。
RTCRtpSender.transformエンコードされた映像および音声フレームの送信パイプラインに変換ストリームを挿入するために使用するプロパティです。
RTC 変換がワーカーで実行する準備ができているか、エンコードされた動画や音声フレームを処理する準備ができています。
この記事では、WebRTC API の基礎となっているプロトコルについて説明しています。
WebRTC 接続WebRTC 接続がどのように動くかを説明するガイド。どのように様々なプロトコルとインターフェイスが協調して用いられることで強力なコミュニケーションアプリを構築することができるかについて説明しています。
WebRTC セッションのライフタイムWebRTCは任意のデータ、音声、映像またはそれらの組み合わせをやりとりするピアーツーピアー通信をブラウザーアプリケーション上に構築することができます。この記事では、接続の確立から不要となり閉じられるまでの WebRTC のライフタイムについて見ていきます。
接続の確立: 完全なネゴシエーションパターン完全なネゴシエーションはシグナリングプロセスが従うべき推奨されるデザインパターンです。二者を区別するためにたくさんのコーディングを必要とせずに、双方をオファー側とアンサー側のどちらにもなれることを可能にするネゴシエーションにおける透過性を提供します。
シグナリングと双方向映像通話以前の例で作成したウェブソケットベースのチャットシステムに参加者同士の映像通話機能を追加するチュートリアルと例。チャットサーバーのウェブソケット接続は WebRTC のシグナリングとして用いられます。
WebRTC で用いられるコーデックWebRTC を用いる上でブラウザーが対応すべきコーデックと様々な有名なブラウザーで対応されている追加的なコーデックについてのガイド。必要に応じたベストなコーデックの選び方についてのガイドも含みます。
WebRTC データチャネルを使うこのガイドでは、ピアー接続と関連する RTCDataChannel を使用して、2 つのピアー間で任意のデータを交換する方法について説明します。
WebRTC での DTMF の使用RTCDTMFSender インターフェイスを用いた DTMF トーン送信サポートを含む、旧式の電話システムとのゲートウェイとやりとりを行うための WebRTC 対応について、このガイドでは、その方法を説明します。
WebRTC エンコード変換このガイドでは、ワーカーで実行する TransformStream を使用して、ウェブアプリケーションが入出力する WebRTCのエンコードされた映像および音声フレームを変更する方法を示します。
WebRTC 組織は、異なるブラウザーの WebRTC 実装における互換性の問題を回避するため adapter.js を提供しています。このアダプターは JavaScript のはシム (Shim) で、あなたのコードを仕様に合わせて記述することで、WebRTC に対応しているすべてのブラウザーで「ただ動く (just work) 」ようにしてくれます。
シンプルな RTCDataChannel のサンプルRTCDataChannel インターフェイスは、2つのピアー間で任意のデータを送受信するためのチャネルを開くことができる機能です。このAPIは意図的に WebSocket API に似せているので、それぞれに同じプログラミングモデルを使用することができます。
Peer.js によるインターネット接続電話の構築このチュートリアルは、 Peer.js を使用して電話を構築する方法を段階を追ってガイドします。
| WebRTC: Real-Time Communication in Browsers |
| Media Capture and Streams |
| Media Capture from DOM Elements |
This page was last modified on 2024年5月16日 by MDN contributors.
Your blueprint for a better internet.
Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
Portions of this content are ©1998–2026 by individual mozilla.org contributors. Content available under a Creative Commons license.