グーグルは、ブラックコミュニティのための人種的資本を進めてまいります。 どのように参照してください。
このページは Cloud Translation API によって翻訳されました。
Switch to English

ピア接続入門

ピア接続、異なるコンピュータ上の2つのアプリケーションを接続すると取引がピア・ツー・ピア・プロトコルを用いて通信することのWebRTC仕様の一部です。ピア間の通信は、(支持クライアントのためのビデオ、オーディオ、または任意のバイナリデータとすることができるRTCDataChannel APIを)。 2つのピアが接続できる方法を発見するためには、両方のクライアントは、ICE Server構成を提供する必要があります。これは、STUNやTURNサーバーのいずれかであり、その役割は、リモートピアに転送され、各クライアントにICE候補を提供することです。 ICE候補の転送これは一般的に、シグナリングと呼ばれています。

シグナリング

WebRTC仕様は、ICE(インターネット接続確立)サーバーと通信するためのAPIを含むが、シグナル伝達成分は、その一部ではありません。シグナリングは、2つのピアが、彼らは接続方法を共有するために必要とされています。通常、これは、通常のHTTPベースのWeb APIを介して解決される(すなわち、RESTサービスまたは他のRPCメカニズム)Webアプリケーションは、ピア接続する前に、必要な情報を中継することができます開始されます。

この架空のシグナリングサービスが非同期メッセージを送受信するために使用することができますどのようにフォローコードスニペットを示しています。これは、必要に応じてこのガイドここで、残りの実施例で使用されるであろう。

 // Set up an asynchronous communication channel that will be
// used during the peer connection setup
const signalingChannel = new SignalingChannel(remoteClientId);
signalingChannel.addEventListener('message', message => {
    // New message from remote client received
});

// Send an asynchronous message to the remote client
signalingChannel.send('Hello!');
 

シグナリングは、多くの異なる方法で実装することができる、とのWebRTCの仕様は、特定のソリューションを好むはありません。

ピア接続を開始

各ピア接続はによって処理さRTCPeerConnectionオブジェクト。このクラスのコンストラクタは、単一の取りRTCConfigurationパラメータとしてオブジェクトを。このオブジェクトは、ピア接続が設定され、使用にICEサーバに関する情報が含まれている方法を定義します。

いったんRTCPeerConnection作成され、私たちは、ピアを呼び出すか、ピアを受けている場合に応じて、SDPオファーや解答を作成する必要があります。 SDPオファーまたは回答が作成されると、それは別のチャネルを介してリモートピアに送信する必要があります。 SDPは、リモートピアにオブジェクトを渡すと、シグナリングと呼ばれ、のWebRTC仕様によって覆われていません。

呼び出し側からのピア接続のセットアップを開始するには、我々は、作成RTCPeerConnectionオブジェクトをしてから呼び出しcreateOffer()作成するために、 RTCSessionDescriptionオブジェクトを。このセッション記述を使用して、ローカル説明として設定されているsetLocalDescription() 、次いで、受信側に私達のシグナリングチャネルを介して送信されます。また、当社の提供するセッション記述に対する答えは、受信側から受信したときのために、当社のシグナリングチャネルにリスナーを設定します。

 async function makeCall() {
    const configuration = {'iceServers': [{'urls': 'stun:stun.l.google.com:19302'}]}
    const peerConnection = new RTCPeerConnection(configuration);
    signalingChannel.addEventListener('message', async message => {
        if (message.answer) {
            const remoteDesc = new RTCSessionDescription(message.answer);
            await peerConnection.setRemoteDescription(remoteDesc);
        }
    });
    const offer = await peerConnection.createOffer();
    await peerConnection.setLocalDescription(offer);
    signalingChannel.send({'offer': offer});
}
 

私たちが作成する前に、受信側では、我々は入ってくるのオファーを待つRTCPeerConnectionインスタンスを。それが終わると、私たちが使用して、受信したプランを設定setRemoteDescription()次に、我々は呼んでcreateAnswer()受け取ったのオファーに対する回答を作成します。この回答を使用して、ローカル記述として設定されているsetLocalDescription()してから、当社のシグナリング・サーバー上で呼び出し側に送られます。

 const peerConnection = new RTCPeerConnection(configuration);
signalingChannel.addEventListener('message', async message => {
    if (message.offer) {
        peerConnection.setRemoteDescription(new RTCSessionDescription(message.offer));
        const answer = await peerConnection.createAnswer();
        await peerConnection.setLocalDescription(answer);
        signalingChannel.send({'answer': answer});
    }
});
 

2つのピアは、ローカルとリモートのセッション記述の両方を設定したら、彼らは、リモートピアの能力を知っています。これは、ピア間の接続の準備ができていることを意味するものではありません。これが機能するために、我々は、他のピアに(シグナリングチャネルを介して)各ピアと転送でICE候補を収集する必要があります。

ICE候補

2つのピアがのWebRTCを使ってcommunitcateする前に、彼らは、接続情報を交換する必要があります。ネットワーク条件は多数の要因にdependning変えることができるので、外部のサービスは、通常のピアに接続するための可能な候補を発見するために使用されます。このサービスは、ICEと呼ばれ、STUNやTURNサーバーのいずれかを使用しています。 STUNは、NATのセッショントラバーサルユーティリティの略で、通常、ほとんどのWebRTCアプリケーションで間接的に使用されています。

TURN(リレーNATトラバーサルを使用する)は、ピア間の接続を確立するためTURNサーバーを使用するSTUNプロトコルとほとんどの市販のWebRTCベースのサービスを組み込んだ、より高度なソリューションです。 WebRTC APIは直接STUNやTURNの両方をサポートし、それはより完全な用語インターネット接続の確立の下に集まっています。 WebRTCの接続を作成するとき、我々は通常のコンフィギュレーション内の1台のまたは複数のICEサーバを提供RTCPeerConnectionオブジェクト。

トリクルICE

いったんRTCPeerConnectionオブジェクトが作成され、基本的な枠組みは、接続の確立(ICE候補)の候補を収集するために提供ICEサーバを使用しています。イベントicegatheringstatechangeRTCPeerConnection ICEの収集がされている状態何の信号( newgatheringまたはcomplete )。

ピアは、ICEの収集が完了するまで待機することは可能であるが、それは「トリクル氷」技術を使用し、それを発見しますと、リモートピアに各ICE候補を送信するために、通常ははるかに効率的です。これはかなりのピア接続のためのセットアップ時間を短縮し、ビデオ通話が少ない遅延で使い始めることができます。

ICE候補を収集するには、単純にするためにリスナーを追加icecandidateイベント。 RTCPeerConnectionIceEvent含有することをリスナーに照射candidateリモートピア(参照シグナル)に送信されるべき新たな候補を表すプロパティ。

 // Listen for local ICE candidates on the local RTCPeerConnection
peerConnection.addEventListener('icecandidate', event => {
    if (event.candidate) {
        signalingChannel.send({'new-ice-candidate': event.candidate});
    }
});

// Listen for remote ICE candidates and add them to the local RTCPeerConnection
signalingChannel.addEventListener('message', async message => {
    if (message.iceCandidate) {
        try {
            await peerConnection.addIceCandidate(message.iceCandidate);
        } catch (e) {
            console.error('Error adding received ice candidate', e);
        }
    }
});
 

接続が確立されました

ICE候補が受信されると、私たちはピア接続のための状態が最終的に接続された状態に変更されます期待してください。これを検出するために、我々は我々にリスナーを追加RTCPeerConnection我々が聞くconnectionstatechangeイベント。

 // Listen for connectionstatechange on the local RTCPeerConnection
peerConnection.addEventListener('connectionstatechange', event => {
    if (peerConnection.connectionState === 'connected') {
        // Peers connected!
    }
});
 

RTCPeerConnection APIドキュメント