PWA浅尝辄止

前段时间看到苹果官方将对PWA提供支持，之前看到沪江也已经开始了PWA的尝试，于是尝试自学了一把，写点心得。

教程

Your First Progressive Web App

几点心得

PWA不算一种技术标准，算是一种理念，目的是为了给web应用提供接近APP的用户体验。大约有几个特性（我理解的，不保证全）：

1. 可添加HOME访问图标，支持全屏运行
2. 离线访问
3. 消息推送

所以，PWA是一系列技术的合集。添加图标这个靠浏览器及系统实现，离线访问依赖了Service Worker + CacheStorage API + Fetch API，消息推送Chrome支持GCM（这玩意国内肯定不好用。。。）

虽然看起来依赖的东西很多都不完备支持（实际上也是），但因为是 Progressive，不支持也没关系，也不影响原来的Web APP运行，就是没了上述的特性而已。总而言之，PWA这东西加上之后，支持的可以提升用户体验，不支持的就当什么都没发生。

示例

模仿官方的示例，我也自己写了一个。只实践了离线访问的特性。

PWA测试页面

总体流程如下：

1. 正常加载页面
2. 检测支持PWA？ 继续3 : 啥也不做。
3. 缓存请求及数据（图片等资源）
4. 再加载页面资源直接从缓存加载，请求的接口数据先从缓存展示，等有返回再更新。

问题

1. 强制需要https
2. 测试离线页面竟然在firfox下完美，在chrome上离线有问题。。。还在找原因。