Google은 흑인 공동체를 위한 인종적 평등을 추구하기 위해 노력하고 있습니다. 자세히 알아보기
이 페이지는 Cloud Translation API를 통해 번역되었습니다.
Switch to English

피어 연결 시작하기

피어 연결은 다른 컴퓨터에서 두 응용 프로그램을 연결하여 피어 투 피어 프로토콜을 사용하여 통신하는 WebRTC 사양의 일부입니다. 피어 간의 통신은 비디오, 오디오 또는 임의의 이진 데이터 일 수 있습니다 ( RTCDataChannel API를 지원하는 클라이언트의 경우). 두 피어가 어떻게 연결할 수 있는지 알아 보려면 두 클라이언트 모두 ICE 서버 구성을 제공해야합니다. 이것은 STUN 또는 TURN 서버이며, 이들의 역할은 각 클라이언트에 ICE 후보를 제공 한 다음 원격 피어로 전송하는 것입니다. 이러한 ICE 후보의 전송을 일반적으로 시그널링이라고합니다.

신호

WebRTC 사양에는 ICE (Internet Connectivity Establishment) 서버와 통신하기위한 API가 포함되어 있지만 신호 구성 요소는 그 일부가 아닙니다. 두 피어가 연결 방법을 공유하려면 신호가 필요합니다. 일반적으로 이는 피어 연결이 시작되기 전에 웹 응용 프로그램이 필요한 정보를 릴레이 할 수있는 일반 HTTP 기반 웹 API (예 : REST 서비스 또는 기타 RPC 메커니즘)를 통해 해결됩니다.

다음 코드 스 니펫은이 허구의 신호 서비스를 사용하여 메시지를 비동기식으로 송수신하는 방법을 보여줍니다. 필요한 경우이 안내서의 나머지 예에서 사용됩니다.

 // 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});
    }
});
 

두 피어가 로컬 및 원격 세션 설명을 모두 설정하면 원격 피어의 기능을 알게됩니다. 피어 간의 연결이 준비되었다는 의미는 아닙니다. 이를 위해서는 각 피어에서 ICE 후보를 수집하고 (시그널링 채널을 통해) 다른 피어로 전송해야합니다.

ICE 후보

두 피어가 WebRTC를 사용하여 통신하기 전에 연결 정보를 교환해야합니다. 네트워크 조건은 여러 가지 요인에 따라 달라질 수 있으므로 일반적으로 외부 서비스는 피어에 연결할 수있는 후보를 검색하는 데 사용됩니다. 이 서비스를 ICE라고하며 STUN 또는 TURN 서버를 사용하고 있습니다. STUN은 NAT 용 세션 탐색 유틸리티의 약자이며 일반적으로 대부분의 WebRTC 애플리케이션에서 간접적으로 사용됩니다.

TURN (Traversal Using Relay NAT)은 STUN 프로토콜을 통합하는 고급 솔루션이며 대부분의 상용 WebRTC 기반 서비스는 피어간에 연결을 설정하기 위해 TURN 서버를 사용합니다. WebRTC API는 STUN과 TURN을 직접 지원하며보다 완벽한 인터넷 연결 설정이라는 용어로 수집됩니다. WebRTC 연결을 만들 때 일반적으로 RTCPeerConnection 개체의 구성에 하나 이상의 ICE 서버를 제공합니다.

세류 얼음

RTCPeerConnection 객체가 생성되면 기본 프레임 워크는 제공된 ICE 서버를 사용하여 연결 설정 후보 (ICE 후보)를 수집합니다. icegatheringstatechange 이벤트는 ICE 수집 상태 ( new , gathering 또는 complete )에서 신호를 RTCPeerConnection .

피어가 ICE 수집이 완료 될 때까지 기다리는 것이 가능하지만 일반적으로 "트리클 아이스"기술을 사용하고 각 ICE 후보가 발견 될 때 원격 피어에 전송하는 것이 훨씬 더 효율적입니다. 이를 통해 피어 연결을위한 설정 시간이 크게 단축되고 화상 통화가 더 적은 지연으로 시작될 수 있습니다.

ICE 후보자를 모으려면 icecandidate 이벤트에 대한 리스너를 추가하기 만하면됩니다. 해당 리스너에서 RTCPeerConnectionIceEventRTCPeerConnectionIceEvent 에는 원격 피어로 전송해야하는 새 후보를 나타내는 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 설명서