怎么通过HTML的MessagePort的start方法显式开启MessageChannel的消息传递-html教程-PHP中文网

port.start() 是启用接收而非开启通道，它使 MessagePort 开始从队列中取出并分发已到达的消息；若未调用，即使消息已发送，监听器也不会触发，消息可能积压或丢失。

怎么通过html的messageport的start方法显式开启messagechannel的消息传递

port.start() 不是“开启通道”，而是“启用接收”

很多人以为 port.start() 是在建立连接或初始化通信链路，其实它只做一件事：**让 MessagePort 开始从内部消息队列中取出并分发已到达的消息**。端口一旦创建（channel.port1 或 channel.port2），通信物理通路就已存在；但若没调用 start()，即使对方已 postMessage()，你也不会触发 onmessage，消息会静默积压或被丢弃（取决于浏览器实现）。

哪些场景下必须显式调用 port.start()

以下情况不调 port.start() 就收不到消息，且控制台几乎不报错，极难排查：

使用 addEventListener('message', handler) 而非 port.onmessage = handler —— 即使绑了监听器，也得先 port.start()
在设置 onmessage 之前就收到了消息（比如 Worker 启动快、主线程发得早）
使用 SharedWorker：页面侧 worker.port 默认处于暂停状态，worker.port.start() 缺一不可
跨 iframe 通信时，子页面在 message 事件回调里拿到 event.ports[0] 后，必须立刻 event.ports[0].start()，不能延后

start() 的调用时机和顺序很关键

port.start() 必须在接收方完成端口获取之后、开始监听之前执行。常见错误顺序：

先 postMessage(..., [port])，再在接收方写 port.onmessage = ...，但忘了 port.start() → 消息丢失
在 self.onmessage 回调里拿到 event.ports[0]，却把它存起来、等其他初始化做完才 .start() → 中间发来的消息全丢
对同一个 port 多次调用 .start() → 无害但没必要；但漏一次，就可能永远卡住

推荐写法（Worker 示例）：

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

self.onmessage = function(e) {
  if (e.data.type === 'INIT_PORT' && e.ports?.length) {
    const port = e.ports[0];
    port.start(); // ✅ 第一行就调
    port.onmessage = e => console.log('received:', e.data);
  }
};