為什么 Service Worker 在 Chrome 中不起作用？

Question

我是網絡開發的新手，如果我不清楚我的問題，我很抱歉。

我正在嘗試制作 PWA，目前正在測試我的清單和服務工作者是否正在工作。 在我的項目中，我有一個 index.html 文件，它調用文件 app.js，我嘗試在其中注冊名為 serviceworker.js 的服務工作者。 這是我嘗試注冊我的服務工作者的代碼段：

if('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/serviceworker.js')
  .then(function() {
    console.log('service worker registered');
  });
}
else {
  console.log('cannot register');
}

當我重新加載我的頁面時，我的控制台顯示“無法注冊”。 為了解決這個問題，我在 if 子句中寫了一行，看看它是否是條件本身的問題。 事實證明，即使刪除 if 和 else 子句並簡單地運行navigator.serviceWorker.register('/serviceworker.js') .then(function() { console.log('service worker registered'); }); 代碼段，控制台顯示錯誤提示“找不到屬性寄存器”。 據我了解，Service Worker 並不適用於所有瀏覽器，但我檢查了它是否在 Chrome 中運行（這是我正在測試的），並且它表示支持 Service Worker。 有人可以告訴我為什么它不起作用嗎？ 我目前正在使用 Chrome 的 80.0.3987.149（官方版本）（64 位）版本。 Alsi，我不知道這是否重要，但我正在使用 Node.js。 提前致謝。

Answer 1

由於聲譽低，無法發表評論，但請檢查此和此。

簡而言之：出於安全原因，Service Workers 要求使用它們的站點通過 HTTPS 提供服務，但對 localhost 有 execptions。

檢查此以了解如何在本地主機上提供您的 html 文件。