如何在 NodeJS 脚本中访问 Chrome Devtools 网络日志数据？答案

【问题标题】：How can I access Chrome Devtools Network Logs data in NodeJS script?如何在 NodeJS 脚本中访问 Chrome Devtools 网络日志数据？
【发布时间】：2022-06-18 21:33:42
【问题描述】：

我目前正在尝试构建一个需要我从网站（OpenSea 市场）读取数据的项目。当我转到该页面时，它会向 API 发送一个 POST 请求（如图 1 所示），我想在我的 NodeJS/TypeScript 项目中访问它返回的数据（如图 2 所示）。

是否有 API 可以做到这一点，或者甚至不可能？

图 1 （我正在尝试访问 graphql/ 请求）：

图 2 （这是我试图进入我的代码的数据）：

【问题讨论】：

你可以劫持XMLHttpRequest和fetch函数。非常规，但它会工作。也许有更有效的方法来解决根本问题？

标签： node.js typescript google-chrome-devtools chrome-devtools-protocol chromelogger

【解决方案1】：

您可以劫持XMLHttpRequest 和fetch 函数。非常规，但它会工作

根据我发表的评论，可以在客户端使用一个小功能来做到这一点

function listen(fn){
  //this line simply adds functions to call in an array based on setup below
  if(listen.prototype.arguments){listen.prototype.arguments.push(fn)}
  
  //below is setup(functions hijacked so services that use them report to this too)
  listen.prototype.arguments=[] //array of functions to call
  let original1=XMLHttpRequest.prototype.send, original2=fetch
  function replace1(){
    let toReturn=original1.bind(this)(...arguments)
    this.addEventListener("load",res=>fn(this.responseText))
    return toReturn
  }
  function replace2(){
    let toReturn=original2.bind(this)(...arguments)
    toReturn.then(res=>res.text().then(fn))
    return toReturn
  }
  Object.defineProperty(XMLHttpRequest.prototype,"send",{value:replace1})
  Object.defineProperty(window,"fetch",{value:replace2})
}



//example usage
let socket=some_Web_Socket_Your_Backend_To_Handle_This_Data
//perhaps this is not the most elaborate example but I hope the point is understood
listen(socket.send.bind(socket))

【讨论】：

您可以编辑listen 函数，根据您的需要提供更多数据

【解决方案2】：

嘿，我可以访问 graphql API，如果你还想要这个，请告诉我？

【讨论】：