如何让服务工作者只在第一次访问时注册？

Question

嗨,我在快递上有一个生成HTML的ejs模板.我已在此模板中编写了我的服务工作者注册码,这对于网站的所有页面都是通用的,因此,注册码最终会出现在网站的每个页面上.因此,在每次用户访问时,运行服务工作者注册代码,我认为这是不好的.如何使这个代码只在第一次访问用户时运行？

请在下面找到我的代码:

<script>
  if ('serviceWorker' in navigator) {
    window.addEventListener('load', function() {
      var hashes = {};
      ["appCss", "appJs"].map((val,idx) => {
        let prop;
        if(document.getElementById(val)) {
          prop = val.toLowerCase().indexOf("css") == -1 ? "src" : "href";
          hashes[val] = document.getElementById(val)[prop];
        }
      });
      hashes = JSON.stringify(hashes);
      navigator.serviceWorker.register(`/service-worker.js?hash=${encodeURIComponent(hashes)}`).then(function(registration) {
        console.log('ServiceWorker registration successful with scope: ', registration.scope);
      }, function(err) {
        console.log('ServiceWorker registration failed:', err);
      });
    });
  }
</script>

Answer 1

来自MDN 文档：

ServiceWorkerContainer 接口的 register() 方法为给定的 scriptURL 创建或更新 ServiceWorkerRegistration。

如果成功，服务工作线程注册会将提供的脚本 URL 绑定到一个范围，该范围随后用于导航匹配。您可以从受控页面无条件调用此方法。即，您不需要首先检查是否有活动注册。

因此，您应该始终register在您的页面上进行调用。浏览器 API 将为您处理这个问题。