BroadcastChannel API là gì?
BroadcastChannel API là một API đơn giản giúp giao tiếp giữa các bối cảnh duyệt web dễ dàng hơn. Đó là, giao tiếp giữa các cửa sổ/tab, iframe, web workers và service workers. Messenger được push lên một channel nhất định sẽ được gửi đến tất cả người nghe của channel đó.
Sử dụng
Hàm tạo BroadcastChannel lấy một tham số duy nhất: tên của kênh. Tên xác định kênh và sống trên các bối cảnh duyệt web.
// Connect to the channel named "channel_name".
const channel = new BroadcastChannel('channel_name');
// Send a message on "channel_name".
channel.postMessage('This is a test message.');
// Listen for messages on "channel_name".
channel.onmessage = function(e) {
console.log('Received', e.data);
};
// Close the channel when you're done.
channel.close(); Dữ liệu được hỗ trợ trong BroadcastChannel
Messages có thể là chuỗi hoặc bất cứ thứ gì được hỗ trợ bởi thuật toán nhân bản có cấu trúc (Strings, Objects, Arrays, Blobs, ArrayBuffer, Map).
Ví dụ – gửi Blob hoặc File
channel.postMessage(new Blob(['foo', 'bar'], {type: 'plain/text'}));Một kênh sẽ không phát sóng đến chính nó. Vì vậy, nếu bạn có một onmessage trên cùng một trang với postMessage() cho cùng một kênh, sự kiện tin nhắn đó sẽ không kích hoạt.
Trình duyệt hỗ trợ BroadcastChannel API
Hiện tại, chỉ có Chrome 54+, Firefox 38+, Edge 79+ và Opera 41+ hỗ trợ BroadcastChannel API.
if ('BroadcastChannel' in self) {
// BroadcastChannel API supported!
console.log('BroadcastChannel API supported!');
}
Trong trường hợp bạn muốn sử dụng cho tất cả browser, bạn có thể require project này https://github.com/pubkey/broadcast-channel
Demo
Bạn có thể check Demo ở đây