「 https://angular.io/guide/service-worker-getting-started 」に記述されているすべてのことを実行して、アプリケーションをPWAにしました。
正確にこのコマンドを使用しました:
ng add @angular/pwa
npm install http-server -g
ng build --prod
http-server -p 8080 -c-1 dist
次に、このURLをChrome(シークレットモードで)で開きました
開発者向けのツール(f12)>アプリケーション> Service Workersを開くと、サービスワーカーが利用できず、オフラインに設定するとWebサイトが機能しません。
私の追加情報angular app:
package.json:(最も重要なもの)
"@angular/core": "^7.0.2",
"@angular/pwa": "^0.10.6",
"@angular/service-worker": "^7.0.4",
"@angular-devkit/build-angular": "^0.10.6",
"@angular/cli": "^7.0.6",
@ angular/cli @ 7.1.4のService Workerセットアップが壊れているようです:
一時的な解決策として、ファイルsrc/main.tsを修正して手動で登録できます(修正したら、手動のサービスワーカー登録を削除できます)。 :
.....
platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
if ('serviceWorker' in navigator && environment.production) {
navigator.serviceWorker.register('/ngsw-worker.js');
}
}).catch(err => console.log(err));
PS:作成されたGithubの問題: https://github.com/angular/angular-cli/issues/13351
ドキュメントから必要なライブラリをインストールするための手順と指示に従っていると思います。 ネットワークの問題をシミュレートする :Tools>Developer Tools>ネットワークタブ>オフラインボックスをチェックします。これで、アプリはネットワーク操作にアクセスできなくなります。 [ネットワーク]タブを見ると、Service Workerがアクティブであることを確認できます。
ブラウザはHTTPのService Workerを登録しないことに注意してくださいlocalhostでない場合。
http-serverを実行すると、コンソールは、アプリケーションが次のURLから提供されることを示しました: http://10.40.59.29:8080 、 http://127.0.0.1:8080 、 http://192.168.255.209:8080 。
IPアドレスをlocalhostに置き換えることを忘れないでください http:// localhost:8080 / のように