使用 localhost 注册 service worker 失败

Question

当我尝试在由节点 Express V4 服务器/在 Chrome 42 上提供的基本应用程序中注册服务工作者时出现以下错误：

DOMException: Failed to register a ServiceWorker: A bad HTTP response code (404) was received when fetching the script. {message: "Failed to register a ServiceWorker: A bad HTTP res…code (404) was received when fetching the script.", name: "NetworkError", code: 19, INDEX_SIZE_ERR: 1, DOMSTRING_SIZE_ERR: 2…} code: 19 message: "Failed to

这里是注册码：

    if ('serviceWorker' in navigator){
    console.log("SW present !!! ");

    navigator.serviceWorker.register('worker.js', {
      //scope: '/toto/'
    }).then(function(registration){
      console.log('Service worker registered : ', registration.scope);
    })
    .catch(function(err){
      console.log("Service worker registration failed : ", err);
    });

  }

Answer 1

我认为您正在尝试注册不存在的脚本。在这种情况下，这个问题就来了。请检查您的脚本路径和范围路径。也许你在这个脚本所在的目录中没有任何 'worker.js'。如果是这种情况，请提供完整路径或在同一目录中提供 worker.js。

Answer 2

我在使用快递服务器时也出现了这个错误。事实证明问题出在服务器设置本身，而不是 service worker 注册码。我已经告诉我的快递应用程序使用

将 index.html 作为默认根目录

app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname + '/index.html'));
});

但是我没有告诉 express 我希望它能够使用的任何其他文件的位置。在这个阶段，我唯一的其他文件是位于目录根目录的服务工作者文件，所以我通过将此行添加到服务器文件来解决问题：

app.use(express.static(__dirname + '/'));

要调试您的问题是否与服务器本身有关，您可以下载 Web Server for Chrome 并将其指向应用程序的根目录。检查服务器是否启动并单击 Web 服务器 URL。如果你的 service worker 注册现在成功了，你就会知道这是你的 express 服务器设置的问题，而不是你的 service worker 注册码。

使用 localhost 注册 service worker 失败

Register service worker failed with localhost

google-chrome

express

service-worker