Google is committed to advancing racial equity for Black communities. See how.
Эта страница была переведа с помощью Cloud Translation API.
Switch to English

Каналы данных

Стандарт WebRTC также охватывает API для отправки произвольных данных через RTCPeerConnection . Это делается путем вызова createDataChannel() для объекта RTCPeerConnection , который возвращает объект RTCDataChannel .

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

Удаленный партнер может принимать каналы передачи данных путем прослушивания для datachannel события на RTCPeerConnection объекте. Полученное событие имеет тип RTCDataChannelEvent и содержит свойство channel которое представляет RTCDataChannel подключенный между узлами.

 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() с данными, которые мы хотим отправить. Параметром 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);
})
 

Удаленный RTCDataChannel будет получать сообщения, отправленные по RTCDataChannel , прослушивая событие message .

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