跨域新窗口双向通信：注入JS并获取执行结果咨询

1. 浏览器扩展（Chrome/Firefox 插件）方案 #

浏览器扩展拥有突破同源策略的特殊权限，是这类需求的常用解决方案：

• 通过content script直接向第三方页面注入JS代码，content script可与扩展的后台（background）或弹窗（popup）通过chrome.runtime.sendMessage/chrome.runtime.onMessage双向通信，传递注入代码的执行结果。
• 核心流程：
  • 扩展后台通过chrome.tabs.create打开目标第三方网页。
  • 匹配该网页的content script自动注入预设JS代码。
  • 注入代码执行完成后，调用chrome.runtime.sendMessage把结果发送给扩展后台。
  • 扩展后台再将结果传递给你的自有应用（网页端应用可通过chrome.runtime.connect建立长连接；桌面端应用可借助扩展的native messaging接口）。

2. Electron等桌面应用框架方案 #

如果你的自有应用是桌面端，Electron这类框架可以轻松实现需求：

• Electron的BrowserWindow加载第三方页面时，可通过webContents.executeJavaScript()方法直接注入JS，且该方法支持异步返回执行结果（Electron主进程与渲染进程的通信不受同源策略限制）。
• 示例代码：

  const { BrowserWindow } = require('electron');
  const win = new BrowserWindow({ width: 800, height: 600 });
  win.loadURL('https://第三方网站地址');
  
  win.webContents.on('did-finish-load', async () => {
    // 注入目标JS并获取执行结果
    const injectResult = await win.webContents.executeJavaScript(`
      // 这里写你要注入的代码，比如获取页面DOM数据
      document.querySelector('.target-element').innerText;
    `);
    console.log('注入代码执行结果:', injectResult);
    // 将结果同步到自有应用的主逻辑中
  });
  

3. 纯前端网页的限制 #

如果你的自有应用是纯前端网页（无后端、非扩展/桌面应用），无法直接实现强制注入并获取数据：

• 浏览器同源策略严格禁止不同域页面之间的无授权通信，即使通过window.open打开第三方页面，也只能通过postMessage发送消息，但前提是第三方页面主动监听message事件并配合返回数据，无法强制注入代码并获取结果。

重要注意事项 #

• 所有能实现跨域注入并获取数据的方案，都依赖高权限执行环境（浏览器扩展、桌面应用框架），纯前端网页受限于同源策略无法完成这类操作。
• 向第三方网站注入代码可能违反网站服务条款或相关法律，使用前务必确认合规性。

内容的提问来源于stack exchange，提问作者Marek Havrila