如何用消息广播机制让 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.ports0 就是一个专属端口,把它存进数组(如 clients = \[\]) 发送广播前,确保每个端口都已调用过 port.start()(使用 port.onmessage 可自动触发) 遍历 clients 数组,对每个端口执行 port.postMessage(data) 注意:若某页面已关闭但端口未及时清理,port.postMessage() 不会报错,但消息无法送达;可结合 port.onclose 或定期检查 port.readyState === 'open' 做清理Worker 脚本示例(shared-worker.js)以下代码实现基础广播能力: Trenz AI驱动的社交电商营销平台,专为TikTok Shop设计

相关推荐
这个DBA有点耶8 小时前
从症状到根因:数据库监控指标的分层方法与静态/动态阈值策略
数据库·mysql·代码规范
全栈弄潮儿8 小时前
Python实战第8期:函数
后端·python·编程语言
SelectDB9 小时前
时间旅行与快照能力速查:Doris 侧三条落地路径
大数据·数据库·数据分析
SelectDB9 小时前
云数仓成本结构拆解速查:五层计费 vs Doris / 托管形态
大数据·数据库·数据分析
SelectDB9 小时前
什么场景能承接与建议保留:Doris vs Snowflake 边界速查
大数据·数据库·数据分析
卷无止境10 小时前
暗流与破局:AI时代的代码安全审查工具全景指南
后端·python
这个DBA有点耶11 小时前
DELETE没删多少数据,表却越来越大——InnoDB删除空洞与页合并失效的根因
数据库·mysql·代码规范
卷无止境13 小时前
一人公司的全栈选型指南:让 AI Agent 写得快,也让生意跑得稳
后端·python
ly768914 小时前
PostgreSQL 备份恢复策略:pg_basebackup、WAL 归档与 PITR 在企业 Java 系统中的落地
java·数据库·postgresql·pitr·pg_basebackup·wal 归档