我很熟悉http状态码,但是最近我在我的Chrome调试器中看到了一个奇怪的行。我看到的不是普通的Status Code:200 OK
,而是:Status Code:200 OK (from ServiceWorker)
。
的数据
我的猜测是,这只是告诉我ServiceWorker在某种程度上负责访问这个文档,但这只是随机猜测。任何作者(没有猜测,与链接到受人尊敬的资源)可以告诉我这是什么意思,有什么影响?
我很熟悉http状态码,但是最近我在我的Chrome调试器中看到了一个奇怪的行。我看到的不是普通的Status Code:200 OK
,而是:Status Code:200 OK (from ServiceWorker)
。
的数据
我的猜测是,这只是告诉我ServiceWorker在某种程度上负责访问这个文档,但这只是随机猜测。任何作者(没有猜测,与链接到受人尊敬的资源)可以告诉我这是什么意思,有什么影响?
4条答案
按热度按时间dtcbnfnu1#
这是一个常见的混淆来源,所以我想深入一点。
我在this Gist中有一个完整的工作演示,你可以通过RawGit查看live version of it。
以下是内联的service worker代码的相关部分,用于说明目的:
字符串
以下是Chrome 48中网络面板的过滤版本,当服务工作者控制页面时,请求是
one.js
,two.js
和three.js
:x1c 0d1x的数据
我们的service worker的
fetch
处理程序将执行以下三项操作之一:one.js
的请求,它将对同一URL发出fetch()
请求,然后使用该响应调用event.respondWith()
。(来自ServiceWorker)”,因为我们在fetch
处理程序中调用了event.respondWith()
。屏幕截图中的第二个one.js
条目,旁边有个小齿轮图标的那个,(来自高速缓存)”,表示在响应事件时在服务工作进程中发出的fetch()
请求。由于实际的one.js
文件已经在点我采取了这个截图,你看到“(从缓存)",但如果HTTP缓存没有响应已经,你会看到一个实际的网络请求沿着响应大小。two.js
的请求,它将通过“凭空”构造一个新的Response
对象来处理请求。(是的,你可以这样做!)在本例中,我们调用event.respondWith()
,因此two.js
有一个条目,“但与one.js
不同的是,我们没有使用fetch()
来填充响应,因此在网络面板中没有two.js
的额外条目。three.js
的请求,我们的service worker的fetch
事件处理程序实际上不会调用event.respondWith()
。从页面的Angular 来看,也从Network面板的Angular 来看,没有service worker参与该请求,这就是为什么在“Size”列中只有“(from cache)”而不是“(from ServiceWorker)”。oxcyiej72#
Service worker是一个由浏览器在后台运行的脚本。因此状态码:200 OK(来自ServiceWorker)意味着GET或HEAD请求的“OK”成功代码,此状态来自ServiceWorker。
您可以阅读此链接以了解更多信息。http://www.html5rocks.com/en/tutorials/service-worker/introduction/
yrdbyhpb3#
这是正常的。为了避免混淆,
200
为每个请求。它显示请求是SUCCESS
,但service-worker
响应了资源/请求,而不是network/server
。lyfkaqu14#
我的理解是:浏览器已经(存储)了上次请求的域的service worker,以有效地为关于状态的新http请求提供响应,从而有助于减少(更快)完成请求-响应周期的时间。