在实际的业务逻辑中,经常是与时间相关的,而前端能获得的时间有两个:客户端的时间,服务器的时间.

客户端时间通过 javascript中的Date对象可以获取,如

  1. var dt = new Date();
  2. var tm = dt.getTime();

那么tm就是客户端的时间,另外也可以通过对应的getFullYear(),getMonth(),getDate()取到对应的年月日等...
但这个时间可靠吗?

好吧,那取服务器时间吧
经常用到的是后台写一个php,jsp,cgi,asp...通过这些程序来返回一个时间,这是一种解决方案,但仅仅一个时间点,有必要用程序后台程序来实现吗?

那还有什么解决方案吗?
PS:在生成页面的时候把服务器时间就写在里边,然后就可以直接用了.但如果只是一个静态页面了呢,能这么干吗?

好吧,我在这里提出我的解决方案: Ajax HTTP Head

原理:
一般服务器在发送静态页面的时候(apache, nginx, lighttpd就目前所知)都是会在 HTTP 头里带一个Date的头信息的,那么我用Ajax直接取头信息里的Date不就OK了吗!8)

PS:但ajax发请求出去不是会有正文返回吗,那正文的内容比请求一次动态页面的代价可高多了,是这样的吗?8)

实现:

  1. var xhr = new XMLHttpRequest();
  2. if( !xhr ){
  3. xhr = new ActiveXObject("Microsoft.XMLHTTP");
  4. }
  5. xhr.open("HEAD",location.href,true);
  6. xhr.onreadystatechange=function(){
  7. if( xhr.readyState == 4 && xhr.status == 200 ){
  8. alert(xhr.getResponseHeader("Date"));
  9. }
  10. }
  11. xhr.send(null);

解释:
常见的Ajax请求方法为GET,POST而这两种请求都可能会返回正文体,而发HEAD头则只会返回对应的头信息,不会有正文,且只要javascript可以执行,就可以取当前域的地址作为请求地址,有一定的通用性,且避免了跨域的问题.:lol:

实践:

以上代码的完整版在ie6,7,8,9,opera,chrome,firefox下测试通过

适用范围:

javascript正常执行的作用域是http/https下生效

其他:
服务器一定会返回Date头信息吗?
这个是RFC里要求服务器必须实现的,只有在101,103,500等几个状态码的情况下服务器才可以不返回Date头.但我们的location.href不在这个情况之列,所以只要当前javascript代码能正常执行(http方式),那么这个时间就可以取得到

定制的服务器不在本文讨论范围之内

转载请保留以下内容:
author:mooring
sites: http://mooring.iteye.com
date:2012/02/23

------------------------------

1. jquery封装的ajax方法获取web服务器时间

var t = $.ajax({type:'HEAD', async:'false'}).getResponseHeader('date'); //同步请求

2.chrome强烈不建议在主线程发同步的ajax请求,异步的写法如下:

var t;

$.ajax({type:'HEAD', async: true})

.success(function(data, status, xhr){

t=xhr.getResponseHeader('Date');

});

通过原生js的ajax或jquery的ajax获取服务器的时间的更多相关文章

  1. js原生ajax与jquery的ajax的用法区别

    什么是ajax和原理? AJAX 是一种用于创建快速动态网页的技术. 通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据 XMLHttpRequest对象的基本属性: onre ...

  2. 原生js使用forEach()与jquery使用each遍历数组,return false 的区别

    原生js使用forEach()与jquery使用each()遍历数组,return false 的区别: 1.使用each()遍历数组a,如下: var a=[20,21,22,23,24]; $.e ...

  3. 原生JS研究:学习jquery源码,收集整理常用JS函数

    原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...

  4. 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

    折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

  5. JS原生ajax与Jquery插件ajax深入学习

    序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...

  6. AJAX初识(原生JS版AJAX和Jquery版AJAX)

    一.什么是JSON 1.介绍 JSON独立于语言,是一种与语言无关的数据格式. JSON指的是JavaScript对象表示法(JavaScript Object Notation) JSON是轻量级的 ...

  7. 原生js实现ajax与jquery的ajax库,及json

    这是一篇笔记博客, Ajax: 和服务器进行数据交换(异步) 用js实现复杂的原理:用于发送请求的对象在不同的浏览器中是不同的 同源策略:ajax发送请求的url地址与服务器地址必须是同一域名,协议, ...

  8. 原生js实现 常见的jquery的功能

    原生选择器   充分利用 bind(this)绑定 <div id="box"> <ul> <li >111 </li> <l ...

  9. 原生js拖拽、jQuery拖拽、vue自定义指令拖拽

    原生js拖拽: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

随机推荐

  1. C# 保留小数点后两位(方法总结)

    最简单使用: float i=1.6667f; string show=i.ToString("0.00"); //结果1.67(四舍五入) 其他类似方法: string show ...

  2. 掌握下面常用函数,学php不再难

    一.写入文件 1.打开资源(文件)fopen($filename,$mode) 2.写文件fwrite($handle,$str) 3.关闭文件fclose($handle) 4.一步写入file_p ...

  3. iOS:将NSDate转换为当前时区时间

     NSDate *date = [NSDate date]; NSTimeZone *zone = [NSTimeZone systemTimeZone]; NSInteger interval = ...

  4. 判断联网wifi

    UIApplication *app = [UIApplication sharedApplication]; NSArray *children = [[[app valueForKeyPath:@ ...

  5. Python 3 学习笔记

    教程地址: http://www.liaoxuefeng.com/wiki/0014316089557264a6b348958f449949df42a6d3a2e542c000/00143161198 ...

  6. (转)Log4J日志配置详解

    http://www.cnblogs.com/ITtangtang/p/3926665.html 一.Log4j简介 Log4j有三个主要的组件:Loggers(记录器),Appenders (输出源 ...

  7. Javaweb统计在线人数的小栗子

    最近在学习Javaweb相关的内容(不黑不吹之前对web开发零基础),下面通过一个统计在线人数的小栗子讲讲Servlet监听器吧 开发环境 eclipse  tomcat 7 先说说这个小栗子的构思: ...

  8. comparable与comparator比较

    两种比较接口分析 前者应该比较固定,和一个具体类相绑定,而后者比较灵活,它可以被用于各个需要比较功能的类使用. 一个类实现了 Camparable 接口表明这个类的对象之间是可以相互比较的.如果用数学 ...

  9. 高性能javascript 学习笔记(1)

    加载和运行 管理浏览器中的javascript代码是个棘手的问题,因为代码运行阻塞了其他浏览器处理过程,诸如用户绘制,每次遇到<script>标签,页面必须停下来等待代码下载(如果是外部的 ...

  10. Python之路:Python 基础(一)

    一.第一句Python代码 在 /home/dev/ 目录下创建 hello.py 文件,内容如下: print "hello,lenliu" 执行 hello.py 文件,即: ...