浏览器的serviceworkerapi允许web设计者为访问者提供他们以前从未有过的东西:即使在离线状态下(无论是短时间还是长时间)也可以访问网站或web应用程序。
p>
无论您是想确保访问者在穿过火车隧道时仍然可以阅读您的网站,还是想创建不需要互联网连接的应用,服务工作人员都能提供完美的解决方案。
尽管ServiceWorker非常出色,但当您第一次开始对其进行编码时,会有一些障碍可能会减慢您的进度-除非您预先意识到这些障碍是什么。本教程将为您提供ServiceWorker开发的五个基本技巧,我们希望它们能够帮助您避免这些问题,并让您免于相关的故障排除麻烦。
开始之前
如果您是ServiceWorker新手,请查看我们的初学者课程《离线网站的简单ServiceWorkers》和JeremyKeith的书《GoingOffline》,这两本书都可以在EnvatoElements上找到。
1.将您的ServiceWorker脚本放入根目录
当您编写第一个服务时可能会遇到的最早问题工人,你可能会做你一直做的事情并把你的脚本进入名为js或scripts的子目录。然而,对于服务人员来说,这种普通的操作可能会出现问题。
原因是,默认情况下,ServiceWorker的范围是由其位置定义的。这意味着什么?这意味着如果您将脚本放在/js目录中,其范围现在仅限于该/js目录。因此,它只能处理来自www.yoursite.com/js/的页面请求,并完全忽略其他请求,例如来自www的请求例如,.yoursite.com或www.yoursite.com/news/。
这种有限的范围反过来意味着您将无法为网站的大部分内容提供离线后备。为了使您的ServiceWorker能够处理来自站点任何部分的任何请求,其范围必须是包罗万象的。
注意:您实际上可以在注册时覆盖ServiceWorker的默认范围,例如