服务工作者可以响应同步XHR请求吗？

Question

我想使用Service Workers来增强现有的网站。 特别是，我想通过让Service Workers在实际资源不可用时使用占位符资源响应请求来添加更好的离线支持。 这种方法一直有效，但我遇到了一个障碍。 站点中有一些地方使用同步 XHR请求来加载某些资源，而我的服务工作者在Chrome中没有收到它们的事件。 （请不要建议消除同步XHR请求。这是期望的，但超出范围。）

是否应该让服务工作者能够响应同步XHR请求？ 我可以想象这实现起来很复杂，并且会理解它是否不受支持。 W3C服务工作者规范（工作草案）和WHATWG获取规范（生活标准）之间应该存在“正确”的答案，但我还没有完成对它们的解密。 我希望解释规范如何描述是否应该支持这一点，和/或对有关指定或实现此行为的讨论的任何引用。

Answer 1

根据XMLHttpRequest规范 ， 同步和异步请求的获取过程是相同的，因此理论上它应该被拦截但是同步XHR已经被弃用，因此我不希望Chrome解决这个问题。

Answer 2

理论上

是的，服务工作者应该能够响应同步XHR请求。 这在规范中没有明确说明，但是没有例外会导致同步XHR请求被区别对待，并且W3C Web平台测试（WPT）套件有一个测试用例来验证它是否受支持： wpt/service-workers/service-worker/fetch-request-xhr-sync.https.html 。

在实践中

自2019年1月起，服务工作者可以在Firefox和Edge中响应同步XHR请求，但不能在Chrome或Safari中响应。 Chrome 计划很快添加支持 ，但我们不知道Safari是否会这样做。

WPT.fyi提供最新的浏览器支持矩阵。 您可以在自己的浏览器中运行WPT测试用例， 网址为https://w3c-test.org/service-workers/service-worker/fetch-request-xhr-sync.https.html 。

Answer 3

您可以通过将异步调用链接在一起来创建同步效果。 它创建缩进的回调 - 而promises会使代码更容易阅读 - 但是第二个Ajax调用直到第一个返回后才会进行。 请注意，在两个调用中，第3个参数都设置为true。

// Synchronized Ajax calls using 2 nested Asynchronous calls

// Asynchronous request #1 using traditional API
const axhr = new XMLHttpRequest();
axhr.open('GET', '/__so-example__', true);
axhr.onload = event => {
  console.log("A-XHR: " + axhr.responseText);

  // Asynchronous request #2 using traditional API
  const sxhr = new XMLHttpRequest();
  sxhr.open('GET', '/__so-example__', true);
  sxhr.onload = event => {
    console.log("S-XHR: " + sxhr.responseText);
  }
  sxhr.send();
}
axhr.send();

这只是一个例子。 我假设promises可以被轻松链接（但是垂直堆叠，而不是右缩进）以创建同步效果。