通过 chrome 扩展保存 POST REQUEST 的 REQUEST body（payload）

问：

我们希望通过 chrome 扩展程序读取/保存 POST REQUEST 的正文/有效负载。

场景：目标网页会偶尔向服务器提交 post 请求。要求：chrome 扩展的弹出窗口 .html 有一个 id='startIntercept' 的按钮，单击后我们需要将下一个触发帖子请求的所有详细信息（标头、有效负载）保存到会话变量中。

我们只需要保存从当前选项卡发送的 POST 请求。 我们并不关心我们收到了什么 POST 请求的响应。

通过一个来源，我们了解到一种通过“覆盖窗口”来实现它的方法。XMLHttpRequest.prototype.open 方法“，方法是将旧的 open 方法保存到变量中，并创建一个新的 open 方法来拦截任何请求并保存它，然后将参数传递给旧的 open 方法以获得通常的预期页面功能。

使用的代码：

//popup.js
let startIntercept = document.getElementById("startIntercept");

startIntercept.addEventListener("click", async () => {
    let [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
    chrome.scripting.executeScript({
        target: { tabId: tab.id },
        files: ["startWork.js"],
    });
});


//startWork.js
let oldXHROpen = window.XMLHttpRequest.prototype.open;
console.log('script injected');
window.XMLHttpRequest.prototype.open = function() {
  this.addEventListener("load", function() {
    const responseBody = this.responseText;
    sessionStorage.setItem('payload', responseBody );
  });
  return oldXHROpen.apply(this, arguments);
};

//manifest.json
    "name": "extTracker",
    "description": "want to save post request details",
    "version": "1.0",
    "manifest_version": 3,
    "background": {
        "service_worker": "background.js"
    },
    "host_permissions": ["<all_urls>"],
    "permissions": ["storage", "activeTab", "scripting"],
    "web_accessible_resources": [{
        "resources": ["/assets/media/blinkSd.mp3"],
        "matches": ["<all_urls>"],
        "use_dynamic_url": true
    }],
    "action": {
        "default_popup": "popup.html",
    },

*一旦我们有了一个工作模型，我们将增强清单文件/过滤器请求以相应地拦截

即使通过脚本“startWork.js”成功注入，上述代码也无法保存/拦截从当前选项卡发出的任何请求。

为什么会失败？？有更好的方法来实现此功能吗？

非常感谢您的专业知识和时间。谢谢