JavaScript ile tarayıcınızdaki sekmeler arası veri alışverişinde bulunabileceğinizi biliyor muydunuz?

Hangi tarayıcıların desteklediğini görmek için buraya tıklayın.

Veri Gönderme

Diğer bir sekmeye veri göndermek için ilk önce BroadcastChannel instance’ı oluşturmamız gerek. Bu oldukça kolay.

const kanal = new BroadcastChannel("kanalim");

Yukarıdaki kanalim kelimesi bizim anahtarımızdır. Bu kelime ile diğer sekmeler ile iletişimde bulunacağız. Bu kanaldan veri yollamak için aşağıdakileri yapabiliriz.

//dizi gönderme
kanal.postMessage([5,12,435,2323]);

//nesne gönderme
kanal.postMessage({ isim: "Kaan", yas: 23});

//blob gönderme
kanal.postMessage(new Blob(["örnek metin"], {
    type: "text/plain"
}));

Veri Alma

Şimdi de, başka bir sekmeden gönderdiğimiz mesajları nasıl alacağımıza bakalım.

// Buradan da "kanalim" kanalını takip etmesini istiyoruz.
const kanal = new BroadcastChannel("kanalim");

channel.addEventListener("message", e => {
    console.log(e.data);
});

Bir veri gönderildiğinde konsola yazdırılmasını istedik.