Angular Service Worker

Service Worker 就是一段运行在 Web 浏览器中，并为应用管理缓存的脚本。

Angular Service Worker 的设计目标

• 应用作为整体被缓存。
• 应用在使用中的更新保持版本一致
• 刷新后得到最新应用版本
• 尽可能的节省带宽

Service Worker 判断缓存依赖 manifest 文件，这个 manifest 文件描述要缓存的资源以及文件内容的哈希。该文件从 CLI 生成的 ngsw-config.json 中生成。

支持

支持的浏览器，目前 chrome、firefox 支持相对较好。

使用 Service Worker

添加 Service Worker

ng add @angular/pwa --project *project-name*

这个步骤会生成 ngsw-config.json 文件

打包项目

ng build --prod

http-server 启动

ng s 对 service worker 无效，所以需要使用 npm 的 http-server

http-server -p 8080 -c-1 dist/<project-name>

观察

实际上到这里就已经使用了 Service Worker，他会按照设计的方式工作。