webRequest API: 如何获取新请求的requestId？

Question

chrome.webRequestAPI有请求ID的概念（来源：Chrome webRequest documention）：

Request IDs

Each request is identified by a request ID. This ID is unique within a browser session and the context of an extension. It remains constant during the the life cycle of a request and can be used to match events for the same request. Note that several HTTP requests are mapped to one web request in case of HTTP redirection or HTTP authentication.

您甚至可以使用它来关联跨重定向的请求。但是，当使用 fetch 或 XMLHttpRequest 开始新请求时，您最初如何阻止 ID？

到目前为止，我还没有发现比使用请求的 URL 作为在新请求和 requestId 之间创建初始 link 更好的方法。但是，如果对同一个资源有重叠的请求，这是不可靠的。

问题：

如果您发出新请求（使用 fetch 或 XMLHttpRequest），您如何可靠地访问 requestId？
fetch API 或 XMLHttpRequest API 是否允许访问 requestId？

我想做的是使用 webRequest API 提供的功能来修改单个请求，但我想确保我不会不小心修改其他待处理的请求。

Answer 1

据我所知，fetch 或 XHMLHttpRequest API 中没有直接支持。我也不知道获取 requestId 的完全可靠的方法。

我最后做的是安装一个 onBeforeRequest 侦听器，存储 requestId，然后立即再次删除侦听器。例如，它可能看起来像这样：

function makeSomeRequest(url) {

  let listener;
  const removeListener = () => {
    if (listener) {
      chrome.webRequest.onBeforeRequest.removeListener(listener);
      listener = null;
    }
  };

  let requestId;
  listener = (details) => {
    if (!requestId && urlMatches(details.url, url)) {
      requestId = details.requestId;
      removeListener();
    }
  };
  chrome.webRequest.onBeforeRequest.addListener(listener, { urls: ['<all_urls>'] });

  // install other listeners, which can then use the stored "requestId"
  // ...

  // finally, start the actual request, for instance
  const promise = fetch(url).then(doSomething);

  // and make sure to always clean up the listener
  promise.then(removeListener, removeLister);
}

它并不完美，匹配 URL 是我未解决的细节。您可以简单地比较 details.url 是否与 url:

相同

function urlMatches(url1, url2) {
  return url1 === url2;
}

请注意，不能保证您看到相同的 URL，例如，如果针对 http://some.domain.test 发出请求，您将在您的侦听器中看到 http://some.domain.test/（请参阅我的 about the details). Or http:// could have been replaced by https:// (here I'm not sure, but it could be because of other extensions like HTTPS Everywhere).

这就是为什么上面的代码只应被视为想法的草图。它在实践中似乎工作得很好，只要你不对相同的 URL 启动多个请求。尽管如此，我还是有兴趣了解解决问题的更好方法。

webRequest API: 如何获取新请求的requestId？

webRequest API: How to get the requestId of a new request?

javascript

xmlhttprequest

google-chrome-extension

firefox-addon-webextensions

fetch-api