由于系统需求变更,需要获取服务器时间;但是由于自己前端js业务代码大部分已经写好,可能懒得原因,不想在移到后台去重新写,所以导致出现了下面的踩坑状况...在此记录一下...
自己前端js获取服务器时间代码(有bug的代码):
var yearmonth = new Date($.ajax({async: false}).getResponseHeader("Date")); //输出结果为:Wed May 22 2019 11:08:47 GMT+0800 (中国标准时间) {}首先,说明一下,这个代码看起来是没有问题的,但是在不同浏览器情况下,比如IE浏览器就会出现这样的情况:
var yearmonth = new Date($.ajax({async: false}).getResponseHeader("Date")); //输出结果为:Thu Jan 01 1970 08:00:00 GMT+0800 (中国标准时间) {}是不是发现什么问题了,上一个结果是2019-05-22,而这一次结果是1970-01-01,这个是什么原因呢?下来我们来探讨一下
第一次出现这个状况是一位客户给我反应的这个问题,说他的日期一直显示1970-01,我说你关闭浏览器(带清缓存步骤),在重新打开试试,结果还是。然后我就懵了,赶紧回头去看代码,咦,代码没错啊!!然后就去找度娘问了半天,大致理出了点头绪。
实际上是这样的,归根结底是IE浏览器的缓存机制问题 下面来探讨一下过程!
这是正常请求时的状况:
注意看请求头与响应头!请求头是向后端发起了请求,并在响应头响应了信息,内部包含“Date”关键字!
出现1970-01时的异常状况:
注意看请求头与响应头!此时并没有向后端发起请求,此时是因为走了IE浏览器的缓存机制,所有响应头不准确,没有“Date”,所有方法没有获取到时间,就会走默认的1970-01-01
两者的比较:
从上图可以看出(正常的是第二个,异常是最后一个),异常的是走的IE浏览器的缓存机制,而正常的是走的http请求,所以问题就很清晰了。
其实出现1970-01这个问题最终是浏览器的兼容问题,由于IE浏览器的缓存机制,导致请求头没有请求到,所以返回计算机的默认时间1970-01
将js代码可以修改为:
var yearmonth = new Date($.ajax({type:"HEAD",async:false,cache:false}).getResponseHeader("Date"));相当于关闭浏览器的缓存,而加入type:"HEAD"是为了请求更快,默认为请求头