如何用消息广播机制让 Shared Worker 通知所有连接的页面

Shared Worker 可通过保存并遍历 MessagePort 实现广播onconnect 时存端口到 clients 数组广播时检查 port.readyState open 后 postMessage页面端创建 SharedWorker 并通过 port.postMessage({type: broadcast}) 触发支持 topic 分类分发。Shared Worker 本身不自带“广播”功能但可以通过在 Worker 脚本中主动遍历所有已连接的 MessagePort 实例逐个调用 port.postMessage()实现向所有页面发送相同消息的效果。这是最常用、最可控的广播方式。核心逻辑收集端口 遍历发送Worker 线程需在 onconnect 事件中保存每个页面传来的通信端口并在需要广播时统一推送每次有新页面连接e.ports[0] 就是一个专属端口把它存进数组如 clients [] 发送广播前确保每个端口都已调用过 port.start()使用 port.onmessage 可自动触发 遍历 clients 数组对每个端口执行 port.postMessage(data) 注意若某页面已关闭但端口未及时清理port.postMessage() 不会报错但消息无法送达可结合 port.onclose 或定期检查 port.readyState open 做清理Worker 脚本示例shared-worker.js以下代码实现基础广播能力 Trenz AI驱动的社交电商营销平台专为TikTok Shop设计