Chrome 扩展开发 MV3：使用 webRequest API 修改页面接口返回值

在 Chrome 扩展的 MV3 版本中，可以使用'declarativeNetRequest' API 来修改页面上的请求和响应。但是，'declarativeNetRequest' API 只能限制请求或者重定向请求，而不能修改响应数据。所以，无法直接使用'declarativeNetRequest' API 来修改接口返回值的数据。

要实现修改接口返回值的数据，可以考虑使用'webRequest' API。以下是一个示例代码，演示如何使用'webRequest' API 来修改接口的响应数据：

1. 在'manifest.json' 文件中声明需要使用'webRequest' 权限：

{
  "manifest_version": 3,
  "name": "My Extension",
  "version": "1.0",
  "permissions": [
    "webRequest",
    "webRequestBlocking",
    "https://www.example.com/*"
  ],
  "background": {
    "service_worker": "background.js"
  }
}

2. 在'background.js' 文件中监听请求并修改响应数据：

chrome.webRequest.onBeforeRequest.addListener(
  function(details) {
    if (details.url === "https://www.example.com/api") {
      return { cancel: true };
    }
  },
  { urls: ["https://www.example.com/api"] },
  ["blocking"]
);

chrome.webRequest.onBeforeSendHeaders.addListener(
  function(details) {
    if (details.url === "https://www.example.com/api") {
      return { cancel: true };
    }
  },
  { urls: ["https://www.example.com/api"] },
  ["blocking"]
);

chrome.webRequest.onHeadersReceived.addListener(
  function(details) {
    if (details.url === "https://www.example.com/api") {
      const filter = chrome.webRequest.filterResponseData(details.requestId);
      let responseData = [];
      filter.ondata = event => {
        responseData.push(event.data);
      };
      filter.onstop = () => {
        const decoder = new TextDecoder("utf-8");
        const responseText = decoder.decode(new Uint8Array(responseData));
        const modifiedResponseText = responseText.replace(
          '{"data":{"name":false}}',
          '{"data":{"name":true}}'
        );
        const encoder = new TextEncoder();
        filter.write(encoder.encode(modifiedResponseText));
        filter.disconnect();
      };
    }
  },
  { urls: ["https://www.example.com/api"] },
  ["blocking"]
);

上述代码中，使用'onBeforeRequest' 和 'onBeforeSendHeaders' 监听请求，如果请求的 URL 是需要修改的接口，可以通过返回' { cancel: true }' 来取消请求。然后，使用'onHeadersReceived' 监听响应，如果响应的 URL 是需要修改的接口，通过'chrome.webRequest.filterResponseData' 获取响应数据，并使用'TextEncoder' 和 'TextDecoder' 来处理数据。

注意，以上代码只是演示示例，实际使用时请根据实际情况修改 URL 和响应数据的处理逻辑。

更多关于'webRequest' API 的详细信息和用法，请参考 Chrome 官方文档：https://developer.chrome.com/docs/extensions/reference/webRequest/