如何使用 chrome-extension 收听 xhr 响应？

Posted 2023-02-27

【中文标题】如何使用 chrome-extension 收听 xhr 响应？

【英文标题】：How can I listen to xhr response using chrome-extension?

【发布时间】：2013-12-16 13:08:19

【问题描述】：

我想在某个 chrome 窗口收到 XHR 响应时执行一个函数。

我不知道这个请求到底是什么样的，因为这个请求的编码参数，例如：api.xxx.com/rest?random=123

所以我不认为我可以使用

chrome.devtools.network.onRequestFinished.addListener(function callback)

或

chrome.webRequest.onCompleted.addListener(function callback)

两者都需要指定请求详细信息。

【参考方案1】：

这些事件的侦听器不需要您指定请求详细信息。相反，它们会在被调用时为您提供这些详细信息。

由于您想监听任何 XHR 请求，您可以定义特殊的 <all_urls> 匹配模式（或 *://*/* 将它们限制为仅 http/https 请求）。

例如：

chrome.webRequest.onCompleted.addListener(function (details) 
  // Process the XHR response.
  ...
, urls: ['<all_urls>']);

---

不要忘记根据您的要求声明适当的权限。 例如：

// In `manifest.json`:
...
"permissions": 
  ...
  "webRequest",
  "<all_urls>"   // <-- add this to listen for XHR from all pages
]

【讨论】：

非常感谢！我现在可以在响应返回时执行我的函数。但我仍然无法获得预期为 json 的响应正文。看来我需要在详细信息中使用url打开一个get请求>

我不认为webRequest API 可以访问响应正文。您可以访问响应标头和状态代码，仅此而已。

遇到同样的问题，我可以确认您无权访问响应正文。 Firefox 引入了“StreamFilters”，但不幸的是 Chrome 没有实现这个功能。