サービスワーカー登録エラー: サポートされていない MIME タイプ ('text/html') 質問する

サービスワーカー登録エラー: サポートされていない MIME タイプ ('text/html') 質問する

私は使用していますReactアプリを作成する急行サーバ。

create-react-appローカルアセットをキャッシュする事前設定されたServiceWorkerがあります(https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#プログレッシブウェブアプリの作成)。

サーバーに公開しようとしたときに発生した問題は、ファイルはservice-worker.js利用可能であったものの、それを登録しようとしたときにブラウザ コンソールにエラーが表示されたことです。

Firefox では、次のエラーが発生しました:

サービスワーカー登録中にエラーが発生しました:

https://example.com/service-worker.jsTypeError:スコープの ServiceWorker スクリプトでhttps://example.com/インストール中にエラーが発生しました。

Chrome では、より説明的なエラーが表示されます。

サービス ワーカーの登録中にエラーが発生しました: DOMException: ServiceWorker の登録に失敗しました: スクリプトにサポートされていない MIME タイプ ('text/html') があります。

確かに、開発者ツールの [ネットワーク] タブでファイルを検索するとservice-worker.js、HTTP ヘッダーの MIME タイプが間違っていることがわかります。

しかし、なぜ MIME タイプが間違っているのか理解できませんでした。

ベストアンサー1

この変更を適用すると:

'/service-worker.js'  // ❌
'./service-worker.js' // ✅

問題は解決しました。

(でnavigator.serviceWorker.register('/service-worker.js')


あるいは、次のものも必要かもしれません:

'%PUBLIC_URL%/serviceworker.js'

感謝ダニエル・ロードのために彼のコメント

おすすめ記事