如何在无服务器、无扩展的情况下实现跨源Chrome标签页间的消息通信？

你提到的尝试的明确结论 #

• 关于获取已有标签页Window引用：不存在无需打开新标签页就能获取任意已有标签页引用的方法，这是浏览器安全沙箱的强制限制，避免恶意页面窃取其他标签页的敏感信息。你尝试的window.open('', 'windowName')方案仅能获取到由当前站点通过window.open打开过的、指定了对应name的标签页引用，无法获取其他方式打开的标签页。
• 关于UDP套接字：普通网页上下文确实不支持UDP套接字调用，仅Chrome扩展、Chrome应用、已安装的受控PWA有权限使用相关能力，不符合你的需求。
• 关于TCP套接字：普通网页只能作为TCP客户端发起连接，无法自主启动TCP服务端，必须依赖外部服务端支持，不符合你的要求。
• 关于LocalStorage跨源：LocalStorage严格遵循同源策略，不存在直接跨源读写的可能，所有跨源数据传递都需要中间代理层实现。

符合要求的可行通信方案 #

方案1：公共同源iframe代理方案（推荐，适合高频通信场景） #

• 实现前提：你可以控制两个不同源站点的前端代码，且有一个可供双方嵌入的公共域名资源
• 实现步骤：
  1. 在公共域名下部署一个静态iframe页面，作为消息中转代理
  2. 两个业务站点都嵌入这个隐藏的公共iframe
  3. 业务页面和自身嵌入的iframe通过postMessage交互，需做好来源校验，仅接收信任域名的消息
  4. 两个同源的公共iframe之间通过BroadcastChannel或者localStorage的storage事件同步消息，完成跨源传递

方案2：命名窗口postMessage方案（适合有互相跳转场景的通信） #

• 实现前提：两个站点至少有一次通过window.open从一方打开另一方的操作
• 实现步骤：
  1. 首次打开目标站点时指定固定窗口名，例如window.open('https://siteB.com', 'fixed_window_name')
  2. 后续需要通信时，通过const targetWin = window.open('', 'fixed_window_name')获取已打开的目标标签页引用
  3. 调用targetWin.postMessage(yourData, 'https://siteB.com')发送消息，目标站点监听window.addEventListener('message', e => { /* 校验来源后处理消息 */ })接收消息
• 注意：postMessage的第二个参数必须指定明确的目标源，禁止使用*避免消息泄露

方案3：剪贴板API方案（适合低频、用户交互触发的通信） #

• 实现前提：通信触发时机伴随用户主动交互（如点击按钮），用户同意站点的剪贴板权限申请
• 实现步骤：
  1. 发送方在用户交互回调中调用await navigator.clipboard.writeText(JSON.stringify({ flag: 'your_custom_flag', data: yourData }))写入剪贴板
  2. 接收方定时轮询或者在用户交互时调用await navigator.clipboard.readText()读取剪贴板内容，识别到约定的自定义标识后处理对应消息
• 注意：该方案会占用用户系统剪贴板，不适合高频通信场景

内容的提问来源于stack exchange，提问作者Yossi Harush