监测网页的刷新操作

项目场景：

业务要求：当用户首次进入A页面时，直接读取LocalStorage数据；当用户F5刷新/网页按钮刷新重新加载页面时，访问服务器获取最新数据并更新LocalStorage。

---

问题描述：

因为要监测网页刷新事件,有两种刷新操作：

一、F5按键刷新，

二、网页上自带的刷新按钮，或者鼠标右键进行刷新

F5按键刷新，就是通过键盘按键事件可以监测到；但是第二种类型的刷新怎么监测？

解决方案：

先谈谈HTML的生命周期：（详情查询：https://www.jianshu.com/p/e0e9a5e42d48）

1、DOMContentLoaded ---- 页面开始加载

2、load ---- 页面完全加载

3、beforeunload ---- 页面离开前 

4、unload ---- 页面完全离开

readystatechange ---- 监听页面加载的状况

其中页面的加载状态值有以下：

A.loading 加载中
B.interactive 互动 - 文档已经完成加载，文档已被解析，但是诸如图像，样式表和框架之类的子资源仍在加载
C.complete - 文档和所有子资源已完成加载。状态表示 load 事件即将被触发

回到问题二、首次和再次加载页面，这些生命周期函数，都是执行的，所以单从生命函数上监测是行不通的

所以还是要接住sessionStorage 或者 cookies 定义标志变量，通过判断标志变量的值判断是首次还是再次！