8

嗨，我在 express 上有一个生成 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>
4

1 回答 1

5

从MDN 文档：

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

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

所以你应该总是register在你的页面上调用。浏览器 API 将为您处理此问题。

于 2018-06-01T09:39:46.407 回答