手机上的web页面的倒计时在手机锁屏后再解锁后发现倒计时不准
手机上的web页面的倒计时在手机锁屏后再解锁后发现倒计时不准的原因是:倒计时的代码在锁屏这段时间不执行。在这里说一下倒计时的实现,在第一次进入倒计时的web页面时请求服务器获取倒计时的剩余时间,然后自己再倒计时;手机在锁屏后再解锁后倒计时还在进行但是倒计时的时间不准确,究其原因是在解锁后没有去请求服务器的时间来重新倒计时而是还是按照上次锁屏的基础上进行倒计时的,这是因为浏览器有缓存,在不刷新页面的情况下,浏览器会缓存第一次请求的内容,服务端更新后浏览器仍然显示第一次的内容
手机上的web页面的倒计时在手机锁屏后再解锁后发现倒计时不准这个问题的解决办法是:把页面设置成无缓存如:
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
设置页面Nocache方式,即每次访问此页面,均需要从服务器重新读取,而不是使用缓存中存在的此页面
通过上面这种方法完美地解决了这问题,之前用过visibilitychange这个事件来解决问题但是没有效果
<meta http-equiv="expires" content="0">
expires用于设定网页的过期时间,一旦过期就必须从服务器上重新加载.时间必须使用GMT格式.
expires出现在http-equiv属性中,使用content属性表示页面缓存的过期时间
content的值为 0是设置缓存的页过期之前的分钟数。若用户在页过期之前返回该页那么就显示缓存的版本。