web-dev-qa-db-ja.com

ローカルホストでService Workerの登録に失敗しました

Chrome 42:

DOMException:ServiceWorkerの登録に失敗しました:スクリプトのフェッチ時に不正なHTTP応答コード(404)を受け取りました。 {メッセージ: "ServiceWorkerの登録に失敗しました:スクリプトのフェッチ時に不正なHTTPリソースコード(404)を受け取りました。"、名前: "NetworkError"、コード:19、INDEX_SIZE_ERR:1、DOMSTRING_SIZE_ERR:2…}コード:19メッセージ:「に失敗しました

登録コードは次のとおりです。

    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);
    });

  }
11
benek

存在しないスクリプトを登録しようとしていると思います。この場合、この問題が発生します。スクリプトパスとスコープパスを確認してください。このスクリプトが存在するディレクトリに「worker.js」がない可能性があります。その場合は、フルパスを指定するか、同じディレクトリにworker.jsを指定してください。

10
Paritosh

高速サーバーを使用しているときにもこのエラーが発生しました。問題は、サービスワーカーの登録コードではなく、サーバーのセットアップ自体にあることがわかりました。私はExpressアプリにindex.htmlをデフォルトのルートとして取得するように指示しました:

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

ただし、使用できるようにしたい他のファイルの場所を明示するように指示していませんでした。この段階で、他の唯一のファイルは、ディレクトリのルートにあるService Workerファイルでした。そのため、サーバーファイルに次の行を追加して問題を修正しました。

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

問題がサーバー自体にあるかどうかをデバッグするには、 Webサーバーfor Chrome をダウンロードして、アプリのルートディレクトリにポイントします。サーバーが起動していることを確認し、WebサーバーのURLをクリックします。 Service Workerの登録が成功すると、Service Workerの登録コードではなく、エクスプレスサーバーの設定に問題があることがわかります。

2
Natstar