electron 捕获浏览器响应数据,如何拦截所有的http请求结果？并对结果进行修改

electron 捕获浏览器响应数据,如何拦截所有的http请求结果？并对结果进行修改。 electron中如何拦截所有的http请求结果？并对结果进行修改. 翻遍了electron文档， 只有request， 没有对Response做处理的， 求教这个怎么解决？ 刚开始使用的是：

try {
  webWindow.webContents.debugger.attach('1.1')
} catch (err) {
  console.log('调试器连接失败: ', err)
}
webWindow.webContents.debugger.on('detach', (event, reason) => {
  console.log('调试器由于以下原因而分离 : ', reason)
})
webWindow.webContents.debugger.addListener('message', (event, method, params) => {
  if (method === 'Network.responseReceived') {
    var mimeType = params.response.mimeType;
    if(mimeType !='image/gif' && mimeType !='image/jpeg' && mimeType == 'application/json'){
      webContents.fromId(2).send("log",method,params)
    }
  }
})
webWindow.webContents.debugger.sendCommand('Network.enable')

这样是拿不到响应内容的，，我需要的数据是

经过两天的研究，尝试过自定义协议，感觉不太合适，最终找到了解决方案

/**
 * 监听网页中http请求，获取请求和响应数据
 */
try {
  webWindow.webContents.debugger.attach('1.3');
} catch (err) {console.log('调试器连接失败: ', err)}
webWindow.webContents.debugger.on('detach', (event, reason) => {
  console.log('调试器由于以下原因而分离 : ', reason)
});
webWindow.webContents.debugger.on('message', (event, method, params) => {
  if (method === 'Network.responseReceived') {
    //params中无响应数据只有响应头
    var mimeType = params.response.mimeType;
    if (mimeType != 'image/gif' && mimeType != 'image/jpeg' && mimeType == 'application/json') {
      webWindow.webContents.debugger.sendCommand('Network.getResponseBody', { requestId: params.requestId }).then(function(response) {
        webContents.fromId(2).send("log",params.response.url,JSON.parse(response.body))
      });
    }
  }
})
webWindow.webContents.debugger.sendCommand('Network.enable');

封装的方法

import {webContents} from "electron";

/**
 * 可以获取到发送请求是的数据
 *  request
 * Network.requestWillBeSent
 * 可以获取到收到的响应数据-不含响应内容（可进一步获取响应内容）
 *  response
 * Network.responseReceived
 */

/**
 *
 * 用于webContents.debugger中
 * 监听网页中http请求，获取请求和响应数据
 * @param webWindow  当前窗体实例
 * @param id 窗体实例ID，用于在渲染线程显示数据
 * @constructor hzq
 */
function GetHttpData(webWindow,id) {
  try {
    webWindow.webContents.debugger.attach('1.1');
  } catch (err) {
    console.log('调试器连接失败: ', err)
  }
  webWindow.webContents.debugger.on('detach', (event, reason) => {
    console.log('调试器由于以下原因而分离 : ', reason)
  });
  webWindow.webContents.debugger.on('message', (event, method, params) => {
    //params中无响应数据只有响应头

    if (method === 'Network.requestWillBeSent') {
        webContents.fromId(id).send("GetHttpData",{type:'req',url:params.request.url},params)
    }

    if (method === 'Network.responseReceived') {
      var mimeType = params.response.mimeType;
      if (mimeType != 'image/gif' && mimeType != 'image/jpeg' && mimeType == 'application/json') {
        webContents.fromId(id).send("GetHttpData",{type:'rep',url:params.response.url},params)
        webWindow.webContents.debugger.sendCommand('Network.getResponseBody', { requestId: params.requestId }).then(function(response) {
          webContents.fromId(id).send("GetHttpData",{type:'repBody',url:params.response.url},JSON.parse(response.body))
        });
      }
    }
  })
  webWindow.webContents.debugger.sendCommand('Network.enable');
}

export default GetHttpData;

使用

//在主进程中调用
GetHttpData(webWindow,2)

当有网络请求时控制台则打印出请求和响应数据

参考链接：https://stackoverflow.com/questions/63330866/electron-how-to-catch-all-the-requests-response-from-the-main-process

【经验分享】使用 Chrome DevTools Protocol 协议，在Network.responseReceived时调用Network.getResponseBody获取应答正文有时会出现“No resource with given identifier”异常，是什么原因？ 解答：当浏览器接收到HTTP应答头之后Network.responseReceived被调用，但此时HTTP应答正文(ResponseBody)可能还没到位，应当在Network.loadingFinished时再调用Network.getResponseBody。