Javascript 是运行在客户端的脚本，我们一般都用 new Date () 来获取当前时间，但是得到的是客户端的时间，客户端时间是随意更改的，如果要做一个产品发布倒计时的话，客户端时间一改，就要闹笑话了。业务中需要用到服务器时间的场景还有很多，那么仅仅通过 js 怎么拿到服务器时间呢？事实上，只需要一个 ajax 请求就搞定，通过读取 XMLHttpRequest 对象的响应头里面的时间戳得到当前服务器时间！，注意，响应头中的时间为 GMT 时间，可以通过 new Date () 转换为中国的时间格式。
原理就是这么简单：通过 ajax 向服务器发送请求，当服务器收到请求后即可读取响应头的时间戳了，不管请求成功或失败，都可以拿到时间戳。怎么判断服务器收到请求了呢？当 ajax 请求发送之后，XMLHttpRequest 有 5 中状态变化：
| XMLHttpRequest.readyState 值 | 表示的意思 |
| 0 | 未初始化，已经创建一个 XMLHttpRequest 对象，但是还没有初始化 |
| 1 | 未发送，代码已经调用了 xmlhttprequest open () 方法并且 xmlhttprequest 已经准备好把一个请求发送到服务器 |
| 2 | 已发送，已经通过 send () 方法把一个请求发送到服务器端，但是还没有收到一个响应，可以读取响应头信息了 |
| 3 | 正在接收，已经接收到 http 响应头部信息，但是消息体部分还没有完全接收完毕 |
| 4 | 已加载，响应已经被完全接收 |
通过监听 XMLHttpRequest 的 readystatechange 事件来判断当前处于哪种状态，从表中可以看出，当 XMLHttpRequest.readyState 值为 2 时就可以读取响应头拿到我们要的时间戳了。代码如下：
<p id="time"></p><script>ajax() function ajax(option){ var xhr = null; if(window.XMLHttpRequest){
xhr = new window.XMLHttpRequest();
}else{ // ie
xhr = new ActiveObject("Microsoft")
} // 通过get的方式请求当前文件
xhr.open("get","/");
xhr.send(null); // 监听请求状态变化
xhr.onreadystatechange = function(){ var time = null,
curDate = null; if(xhr.readyState===2){ // 获取响应头里的时间戳
time = xhr.getResponseHeader("Date"); console.log(xhr.getAllResponseHeaders())
curDate = new Date(time); document.getElementById("time")[removed] = "服务器时间是："+curDate.getFullYear()+"-"+(curDate.getMonth()+1)+"-"+curDate.getDate()+" "+curDate.getHours()+":"+curDate.getMinutes()+":"+curDate.getSeconds();
}
}
}</script>应用场景：判断时间获取的时间是否符合订餐时间
<script>function updateorder(username, status, starthour, endhour) { //Logger log = Logger.getLogger(this.getClass());
var xhr = null; if (window.XMLHttpRequest) {
xhr = new window.XMLHttpRequest();
} else { // ie
xhr = new ActiveObject("Microsoft")
} // 通过get的方式请求当前文件
xhr.open("get", "/javawebservlet/index.jsp");
xhr.send(null); // 监听请求状态变化
xhr.onreadystatechange = function () { var time = null; if (xhr.readyState === 2) { // 获取响应头里的时间戳
time = xhr.getResponseHeader("Date"); console.log(xhr.getAllResponseHeaders()); var date = new Date(time); console.log("转换后的中国时间为： "+date)
//1. 创建Date对象// var date = new Date();
//5. 获得当前小时
var hour = date.getHours(); //6. 获得当前分钟
var min = date.getMinutes(); //7. 获得当前秒
var sec = date.getSeconds();// alert(hour + ":" + min + ":" + sec);
var curr = hour * 60 * 60 + min * 60 + sec; var startime = starthour * 60 * 60 + 30 * 60; var endtime = endhour * 60 * 60 + 15 * 60; var startimetext = "还没有到订餐时间！"; var endtimetext = "吃饭不积极，订餐已经结束了！"; if (username.length == 0) {
layer.msg('请重新登录！', {icon: 1, time: 3000}); //重定向，打开新页面同时把老页面关闭
window.top.location.href = "/javawebservlet/login.jsp"
} else { if (curr < startime) { //alert("还没有开始"); layer.open({ type: 1
, offset: 'auto'
, id: 'layerDemo' + 1 //防止重复弹出
, content: '<div style="padding: 20px 100px;">' + startimetext + '</div>'
, btn: '关闭全部'
, btnAlign: 'c' //按钮居中
, shade: 0 //不显示遮罩
, yes: function () {
layer.closeAll();
}
});
} else if (curr > endtime) {// alert("已经结束"); layer.open({ type: 1
, offset: 'auto'
, id: 'layerDemo' + 1 //防止重复弹出
, content: '<div style="padding: 20px 100px;">' + endtimetext + '</div>'
, btn: '关闭全部'
, btnAlign: 'c' //按钮居中
, shade: 0 //不显示遮罩
, yes: function () {
layer.closeAll();
}
});
} else if (curr >= startime && curr <= endtime) {
layer.msg('订餐成功！', {icon: 1, time: 3000}); [removed].href = "/javawebservlet/UpdateStatusServlet?username=" + username + "&status=" + status;
}
}
}
}</script><span class="layui-btn layui-btn-normal layui-btn-mini" onclick='updateorder("${username}","1","15","18")'>一起订餐</span>
