ICEの方が一般的に早く接続が確立します。AnswerSDPには通信を始める側(Offer)と、通信を受け入れる側(Answer)があります。Answerの順番でやりとりする必要があります。candidate)のやり取りをソースコードで見てみましょう。[Connect]ボタンを押してSDPを生成するところまでです。{console.error(err);});}発信側で[Connect]ボタンをクリックすると、次の処理が行われます。setLocalDescription()は非同期で処理が行われます。従来はコールバックで後続処理を記述していましたが、現在はPromiseを返すので、then()の中に処理を記述します。※2014年の記事ではsetLocalDescription()が非同期であることを意識しおらず、誤った記述になっていました。candidateの収集です。candidateの収集も非同期に行われるため、RTCPeerConnectionのイベントハンドラで行います。peer;}今回のコードではprepareNewConnection()の中でRTCPeerConnectionオブジェクトを生成し、各種イベントハンドラを設定しています。candidateのためRTCPeerConnection.onicecandidateにイベントハンドラを記述しています。このイベントは複数回発生します。candidateを収集し終わると空のイベントが渡ってきます。このタイミングで最終的なSDPを相手に送信します。今回の手動シグナリングではsendSdp()の中でテキストエリアに表示しています。setOffer()の中では次の処理が行われています。setRemoteDescription()で覚える。SDPの生成→送信makeAnswer()の中ではOfferの時と同様な処理が行われます。SDPを、RTCPeerConnection.setLocalDescription()で覚える。candidateを収集し、すべて揃ったらsendSdp()でOffer側に送り返します。err);});}setAnswer()の中ではRTCPeerConnection.setRemoteDescription()で受け取ったSDPを覚えます。映像/音声の送受信PeerConnectionのオブジェクトを生成した際に、送信する映像/音声ストリームをRTCPeerConnection.addStream()で指定しておきます。peer;}SDPの交換が終わると、P2P通信に相手の映像/音声が含まれていればイベントが発生します。ハンドラを記述するようになっています。Firefoxはontrack()がすでに使えるようになっていて、onaddstream()は非推奨になっています。....}以上で主要な処理の解説は終わりです。次回は今回は手動で情報交換を行い、原始的なビデオチャットを動かしてみました。P2P通信が確立するまでの動きを実感していただけたのではないでしょうか?実際の利用場面では手動シグナリングなんかやってらません。次回はシグナリングサーバーを使って、通信を行ってみたいと思います。