Veri kanalları

WebRTC standardı, RTCPeerConnection üzerinde rastgele veri gönderme API'sini de kapsar. Bu işlem, RTCDataChannel nesnesi döndüren RTCPeerConnection nesnesinde createDataChannel() çağrısı yapılarak gerçekleştirilir.

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

Uzak eş, RTCPeerConnection nesnesinde datachannel etkinliğini dinleyerek veri kanallarını alabilir. Alınan etkinlik, RTCDataChannelEvent türündedir ve benzerler arasında bağlı RTCDataChannel öğesini temsil eden bir channel özelliği içerir.

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

Etkinlikleri açma ve kapatma

Bir veri kanalının veri göndermek için kullanılabilmesi için önce istemcinin açılana kadar beklemesi gerekir. Bu işlem, open etkinliği dinlenerek yapılır. Benzer şekilde, iki taraf da kanalı kapattığında close etkinliği gerçekleşir.

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

Mesajlar

RTCDataChannel üzerinde mesaj göndermek için, göndermek istediğimiz verilerle birlikte send() işlevini çağırmamız gerekir. Bu işlev için data parametresi bir dize, Blob, ArrayBuffer veya ArrayBufferView olabilir.

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

Uzaktaki eş, message etkinliğini dinleyerek RTCDataChannel üzerinde gönderilen mesajları alır.

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