PWA 是 Progressive Web Apps 的简称,翻译过来就是渐进式 Web 应用。由 Google 提出来的 web 技术,我第一次知道它是在 2017 年的 Google 开发者大会上。我那时希望它能越来越强大,能直接干掉原生的应用。2018 年也做过一个简单的尝试,将自己的博客换成了 PWA,具体看这篇,但几年下来,回头看看,似乎这阵风并没有吹很大。
下面写一个简单的 PWA,它和写网站差不多,但在网站上增加了一些东西。
以及里面引用的 style.css 和一个图片 icon.png
到这里,网站就写完了,将它放到服务器上,可以通过浏览器来访问,但它还不是一个 PWA,比如当没有网络的时候,我们就无法使用它,而且现在还不能像原生的应用一样,被安装到手机里,必须要依赖浏览器,才能被访问到。PWA 通过 Service Worker 解决了离线的问题,Service Worker 的作用不只是如此,将上面的代码更新为
Service Worker 的注册也可以是在指定的域下面,但如果指定域了,它就只能作用于该域下面的所有页面。
先注册,然后安装,然后激活,最后是结束,所以上面的代码就很好理解了。
Manifest.json 文件是 Web 应用的配置文件,用于指定应用的显示名称、图标、应用入口文件地址及需要使用的设备权限等信息。也是扩展的配置文件,指明扩展的各种信息。
最后将代码上传到服务器,通过网址访问,然后在浏览器中,将该页面增加到桌面即可。
除特别注明外,所有文章均采用Creative Commons BY-NC-ND 4.0(自由转载-保持署名-非商用-禁止演绎)协议发布。