如何在Electron WebView中拦截HTTP请求响应体以替代屏幕抓取？

方法一：正确使用WebContents Debugger API #

你之前尝试的mainWindow.webContents.debugger.attach未生效，大概率是调用时机或目标实例错误，正确流程如下：

• 注意WebView是独立子窗口，需获取WebView元素自身的webContents，而非主窗口的
• 附加调试器时指定标准协议版本（如1.3）
• 启用Network监控后，通过responseReceived事件拿到请求ID，再调用getResponseBody获取响应体

示例代码（渲染进程中操作WebView）：

const webview = document.querySelector('webview');

webview.addEventListener('dom-ready', () => {
  const debuggerClient = webview.getWebContents().debugger;
  debuggerClient.attach('1.3');

  debuggerClient.on('message', (event, method, params) => {
    if (method === 'Network.responseReceived') {
      // 过滤Salesforce相关请求
      if (params.response.url.includes('.salesforce.com')) {
        debuggerClient.sendCommand('Network.getResponseBody', { requestId: params.requestId }, (error, result) => {
          if (!error) {
            const responseBody = result.base64Encoded ? atob(result.body) : result.body;
            // 这里处理捕获到的响应体
            console.log('捕获到响应体:', responseBody);
          }
        });
      }
    }
  });

  debuggerClient.sendCommand('Network.enable');
});

方法二：修复Monkey Patch XMLHttpRequest #

preload注入失效多因页面CSP或上下文隔离限制，可通过以下方式改进：

• 给WebView开启nodeintegration="true"和contextIsolation="false"（仅信任Salesforce站点时使用，注意安全风险）
• 在页面加载前注入补丁，确保覆盖原生XHR

示例preload脚本：

// preload.js
window.addEventListener('DOMContentLoaded', () => {
  const originalXHR = XMLHttpRequest;
  XMLHttpRequest = function() {
    const xhr = new originalXHR();
    const originalSend = xhr.send;
    
    xhr.send = function() {
      xhr.addEventListener('load', () => {
        if (xhr.responseURL.includes('.salesforce.com')) {
          const responseBody = xhr.responseText;
          console.log('XHR响应体:', responseBody);
          // 可通过ipcRenderer将数据传递到主进程处理
        }
      });
      originalSend.apply(this, arguments);
    };
    return xhr;
  };
});

WebView标签配置：

<webview src="https://你的Salesforce地址.com" preload="./preload.js" nodeintegration="true" contextIsolation="false"></webview>

方法三：使用WebRequest拦截响应（Electron 12+支持） #

WebRequest并非只能捕获请求头，开启extraInfoSpec包含responseBody后，可在onResponseStarted事件中获取响应体：

// 主进程中针对WebView的session配置
const { session } = require('electron');

// 若WebView使用默认session，直接操作session.defaultSession即可
session.defaultSession.webRequest.onResponseStarted(
  { urls: ['*://*.salesforce.com/*'] },
  (details, callback) => {
    if (details.responseBody) {
      const body = details.responseBody.base64Encoded 
        ? Buffer.from(details.responseBody.data, 'base64').toString() 
        : details.responseBody.data;
      console.log('WebRequest捕获响应体:', body);
    }
    callback({});
  },
  ['responseBody'] // 必须指定该参数才能获取响应体
);

内容的提问来源于stack exchange，提问作者The Doctor