搜索

多个网页之间如何相互通讯和发送接收消息？

javascript html5

请问多个网页之间如何相互通讯和发送接收消息？

网友回复

在前端开发中，如果需要多个网页（或者称为多个浏览器标签页或窗口）之间进行通讯和消息传递，可以通过以下几种方式实现：

1. 使用 localStorage 和 storage 事件

localStorage 是浏览器提供的一种本地存储机制，可以在同一个浏览器的不同标签页之间共享数据。结合 storage 事件，可以实现一种简单的消息传递机制。

示例：

在一个页面中监听 storage 事件：

window.addEventListener('storage', function(event) {
    if (event.key === 'mySharedData') {
        console.log('接收到消息：', event.newValue);
    }
});

在另一个页面中写入数据：

localStorage.setItem('mySharedData', 'Hello from another page!');

这样，当第二个页面写入数据时，第一个页面会监听到 storage 事件，并读取到写入的数据。

2. 使用 Broadcast Channel API

Broadcast Channel API 允许不同浏览上下文（如不同的标签页或浏览器窗口）之间进行双向通讯。

示例：

在一个页面创建 Broadcast Channe...

点击查看剩余70%

我知道答案，我要回答

我有问题

私活外包