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

데이터 채널

WebRTC 표준은 RTCPeerConnection 통해 임의의 데이터를 전송하기위한 API도 포함합니다. RTCPeerConnection 객체를 반환하는 RTCDataChannel 객체에서 createDataChannel() 을 호출하면됩니다.

 const peerConnection = new RTCPeerConnection(configuration);
const dataChannel = peerConnection.createDataChannel();
 

원격 피어가 데이터를 수신하여 채널을 수신 할 수 datachannel 온 이벤트 RTCPeerConnection 개체. 수신 된 이벤트는 RTCDataChannelEvent 유형 RTCDataChannelEvent 피어간에 연결된 RTCDataChannel 을 나타내는 channel 특성을 포함합니다.

 const peerConnection = new RTCPeerConnection(configuration);
peerConnection.addEventListener('datachannel', event => {
    const dataChannel = event.channel;
});
 

이벤트 열기 및 닫기

데이터 채널을 사용하여 데이터를 전송하려면 클라이언트가 열릴 때까지 기다려야합니다. 이것은 open 이벤트를 들으면서 수행됩니다. 마찬가지로 어느 쪽이 채널을 닫을 때 close 이벤트가 있습니다.

 const messageBox = document.querySelector('#messageBox');
const sendButton = document.querySelector('#sendButton');
const peerConnection = new RTCPeerConnection(configuration);
const dataChannel = peerConnection.createDataChannel();

// Enable textarea and button when opened
dataChannel.addEventListener('open', event => {
    messageBox.disabled = false;
    messageBox.focus();
    sendButton.disabled = false;
});

// Disable input when closed
dataChannel.addEventListener('close', event => {
    messageBox.disabled = false;
    sendButton.disabled = false;
});
 

메시지

RTCDataChannel 에서 메시지 보내기는 send() 는 데이터와 함께 send() 함수를 호출하여 수행됩니다. 이 함수의 data 매개 변수는 문자열, Blob , ArrayBuffer 또는 ArrayBufferView 있습니다.

 const messageBox = document.querySelector('#messageBox');
const sendButton = document.querySelector('#sendButton');

// Send a simple text message when we click the button
sendButton.addEventListener('click', event => {
    const message = messageBox.textContent;
    dataChannel.send(message);
})
 

원격 피어는 message 이벤트를 수신하여 RTCDataChannel 전송 된 메시지를 수신합니다.

 const incomingMessages = document.querySelector('#incomingMessages');

const peerConnection = new RTCPeerConnection(configuration);
const dataChannel = peerConnection.createDataChannel();

// Append new messages to the box of incoming messages
dataChannel.addEventListener('message', event => {
    const message = event.data;
    incomingMessages.textContent += message + '\n';
});