如何用消息广播机制让 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设计

相关推荐
2601_962293248 小时前
Python自动化统计团队工作量并生成可视化仪表盘的脚本方案【指导】
python·数据分析·自动化·可视化·仪表盘
2601_962293799 小时前
OCRmyPDF批处理脚本:使用Python自动化复杂OCR任务
python·自动化·批处理脚本·ocrmypdf·ocr任务
袋鼠云数栈10 小时前
实时湖仓如何真正做到“数据够新”?
大数据·数据库·人工智能·数据治理
ACP广源盛1392462567310 小时前
M6/M5 Pro Mac mini 端侧 AI 落地@ACP#YLB3116 中端多盘存储扩展在 AI 服务中的机会与应用场景
大数据·网络·数据库·人工智能·嵌入式硬件·macos
Java后端的Ai之路10 小时前
20、Python - 备忘录模式
开发语言·人工智能·python·外观模式·备忘录模式
ACP广源盛1392462567310 小时前
M6/M5 Pro Mac mini 端侧 AI 新形态@ACP#GSV5800 Serdes 长距离视频传输在 AI 服务中的机会与落地场景
大数据·网络·数据库·人工智能·嵌入式硬件·macos·音视频
2601_9620777111 小时前
基于Python与NLP的新闻事件信息抽取实战:从NER到时空标准化
python·nlp·transformers·spacy·新闻事件抽取
JavaPub-rodert11 小时前
LangChain 从入门到 Agent 实战:用 Python 搭建一个真正能调用工具和知识库的 AI 助手
人工智能·python·langchain
郝学胜-神的一滴12 小时前
Qt 高级编程 045:坐标体系深度实战
开发语言·c++·windows·python·qt·程序人生
倔强的石头_12 小时前
事务边界与批量写入:避免长事务、锁等待和日志压力
数据库