JavaScript获取服务器时间的方法详解


Posted in Javascript onDecember 11, 2016

本文实例讲述了JavaScript获取服务器时间的方法。分享给大家供大家参考,具体如下:

Javascript是运行在客户端的脚本,我们一般都用new Date()来获取当前时间,但是得到的是客户端的时间,客户端时间是随意更改的,如果要做一个产品发布倒计时的话,客户端时间一改,就要闹笑话了。业务中需要用到服务器时间的场景还有很多,那么仅仅通过js怎么拿到服务器时间呢?事实上,只需要一个ajax请求就搞定,通过读取XMLHttpRequest对象的响应头里面的时间戳得到当前服务器时间!

原理就是这么简单:通过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").innerHTML = "服务器时间是:"+curDate.getFullYear()+"-"+(curDate.getMonth()+1)+"-"+curDate.getDate()+" "+curDate.getHours()+":"+curDate.getMinutes()+":"+curDate.getSeconds();
  }
 }
 }
</script>

到此,服务器时间就取到了。其实响应头里面的信息不仅仅有时间戳,可以使用xhr.getAllResponseHeaders()来获取整个响应头信息,响应头里面还包括服务器类型及版本号、请求的文件类型及编码等其他信息(见下图一),都可以通过这种方式读取。为了证明获取的确实是服务器时间,我用手机测试了一下(见下图二),当前北京时间是2015年4月20日21:59,PC机时间我调成了2015年2月1日 21:16

图一

 JavaScript获取服务器时间的方法详解

图二

 JavaScript获取服务器时间的方法详解

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery 上下滚动广告
Jun 17 Javascript
javascript中substr,substring,slice.splice的区别说明
Nov 25 Javascript
从阶乘函数对比Javascript和C#的异同
May 31 Javascript
基于jquery实现后台左侧菜单点击上下滑动显示
Apr 11 Javascript
使用mint-ui实现省市区三级联动效果的示例代码
Feb 09 Javascript
JavaScript实现封闭区域布尔运算的示例代码
Jun 25 Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
Mar 29 Javascript
关于js陀螺仪的理解分析
Apr 11 Javascript
微信小程序实现批量倒计时功能
Nov 01 Javascript
使用Vant完成DatetimePicker 日期的选择器操作
Nov 12 Javascript
HTML元素拖拽功能实现的完整实例
Dec 04 Javascript
利用前端HTML+CSS+JS开发简单的TODOLIST功能(记事本)
Apr 13 Javascript
基于jQuery实现的查看全文功能【实用】
Dec 11 #Javascript
AngularJS过滤器filter用法分析
Dec 11 #Javascript
jquery判断页面网址是否有效的两种方法
Dec 11 #Javascript
JavaScript奇技淫巧44招【实用】
Dec 11 #Javascript
利用JS判断鼠标移入元素的方向
Dec 11 #Javascript
实现JavaScript高性能的数据存储
Dec 11 #Javascript
探索Javascript中this的奥秘
Dec 11 #Javascript
You might like
php cookie使用方法学习笔记分享
2013/11/07 PHP
PHP操作FTP类 (上传、下载、移动、创建等)
2016/03/31 PHP
javascript内存管理详细解析
2013/11/11 Javascript
jQuery简单实现遍历数组的方法
2015/04/14 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
2015/09/17 Javascript
angularJS与bootstrap结合实现动态加载弹出提示内容
2015/10/16 Javascript
基于JavaScript实现根据手机定位获取当前具体位置(X省X市X县X街道X号)
2015/12/29 Javascript
JQuery ztree 异步加载实例讲解
2016/02/25 Javascript
asp.net+jquery.form实现图片异步上传的方法(附jquery.form.js下载)
2016/05/05 Javascript
Vuejs第十二篇之动态组件全面解析
2016/09/09 Javascript
利用js+css+html实现固定table的列头不动
2016/12/08 Javascript
jQuery实现的浮动层div浏览器居中显示效果
2017/02/03 Javascript
微信小程序 wx.login解密出现乱码的问题解决办法
2017/03/10 Javascript
JavaScript Drum Kit 指南(纯 JS 模拟敲鼓效果)
2017/07/23 Javascript
使用vue的v-for生成table并给table加上序号的实例代码
2017/10/27 Javascript
详解vue项目的构建,打包,发布全过程
2017/11/23 Javascript
JS小球抛物线轨迹运动的两种实现方法详解
2017/12/20 Javascript
node.js环境搭建图文详解
2018/09/19 Javascript
JavaScript使用闭包模仿块级作用域操作示例
2019/01/21 Javascript
Vue实现类似Spring官网图片滑动效果方法
2019/03/01 Javascript
如何阻止移动端浏览器点击图片浏览
2020/08/29 Javascript
小程序点餐界面添加购物车左右摆动动画
2020/09/23 Javascript
原生JavaScript实现进度条
2021/02/19 Javascript
[00:53]TI3正赛第三天 DK怒破A队不败金身 现场国旗飘扬热血激昂
2013/08/10 DOTA
python处理cookie详解
2014/02/07 Python
Python中的groupby分组功能的实例代码
2018/07/11 Python
django多个APP的urls设置方法(views重复问题解决)
2019/07/19 Python
Python中常用的os操作汇总
2020/11/05 Python
python IP地址转整数
2020/11/20 Python
凯伦·米莲女装网上商店:Karen Millen
2017/11/07 全球购物
深圳茁壮笔试题
2015/05/28 面试题
行政专员求职信范文
2014/05/03 职场文书
党的群众路线教育实践活动教师自我剖析材料
2014/10/09 职场文书
常住证明范本
2015/06/23 职场文书
2016五一劳动节慰问信
2015/11/30 职场文书
Python中的socket网络模块介绍
2022/07/23 Python