通过原生js的ajax或jquery的ajax获取服务器的时间
在实际的业务逻辑中,经常是与时间相关的,而前端能获得的时间有两个:客户端的时间,服务器的时间.
客户端时间通过 javascript中的Date对象可以获取,如
- var dt = new Date();
- 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)
实现:
- var xhr = new XMLHttpRequest();
- if( !xhr ){
- xhr = new ActiveXObject("Microsoft.XMLHTTP");
- }
- xhr.open("HEAD",location.href,true);
- xhr.onreadystatechange=function(){
- if( xhr.readyState == 4 && xhr.status == 200 ){
- alert(xhr.getResponseHeader("Date"));
- }
- }
- 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获取服务器的时间的更多相关文章
- js原生ajax与jquery的ajax的用法区别
什么是ajax和原理? AJAX 是一种用于创建快速动态网页的技术. 通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据 XMLHttpRequest对象的基本属性: onre ...
- 原生js使用forEach()与jquery使用each遍历数组,return false 的区别
原生js使用forEach()与jquery使用each()遍历数组,return false 的区别: 1.使用each()遍历数组a,如下: var a=[20,21,22,23,24]; $.e ...
- 原生JS研究:学习jquery源码,收集整理常用JS函数
原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
- JS原生ajax与Jquery插件ajax深入学习
序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...
- AJAX初识(原生JS版AJAX和Jquery版AJAX)
一.什么是JSON 1.介绍 JSON独立于语言,是一种与语言无关的数据格式. JSON指的是JavaScript对象表示法(JavaScript Object Notation) JSON是轻量级的 ...
- 原生js实现ajax与jquery的ajax库,及json
这是一篇笔记博客, Ajax: 和服务器进行数据交换(异步) 用js实现复杂的原理:用于发送请求的对象在不同的浏览器中是不同的 同源策略:ajax发送请求的url地址与服务器地址必须是同一域名,协议, ...
- 原生js实现 常见的jquery的功能
原生选择器 充分利用 bind(this)绑定 <div id="box"> <ul> <li >111 </li> <l ...
- 原生js拖拽、jQuery拖拽、vue自定义指令拖拽
原生js拖拽: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
随机推荐
- JS HTML DOM
HTML DOM (文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). HTML DOM 模型被构造为对象的树. HTML DOM 树 通过 ...
- 如何上传base64编码图片到七牛云
接口说明 POST /putb64/<Fsize>/key/<EncodedKey>/mimeType/<EncodedMimeType>/crc32/<Cr ...
- Sublime Text3快捷方式总结
Ctrl+P快速查找 Ctrl+D多行游标//同时选中多个地方进行编辑 Ctrl+F查找替换 Ctrl+H查找替换 Ctrl+G快速跳到某一行 Ctrl+shift+P命令模式 在命令模式下设置语法: ...
- 通过配置Tomcat,让Android真机通过局域网访问PC的文件
在 Tomcat 根目录,找到conf\server.xml文件. 1.打开server.xml查找修改端口为8080端口: <Connector port="8080" p ...
- c# 遍历文件夹及其所有文件
利用VS创建一个winform应用程序,遍历指定文件夹(photos)内的所有文件夹及其文件.具体程序如下: namespace 遍历文件夹及其所有文件 { public partial class ...
- ExtJs目录说明
Ext开发包目录结构说明builds目录为ExtJS压缩后的代码docs目录为ExtJS的文档examples目录中是官方的演示示例locale是多国语言的资源文件, 其中ext - lang - z ...
- Oracle Enterprise Manager 11g 输入用户名和口令 点击“登录”按键后没反应,也不报错,是什么原因?
在tnsnames.ora文件中检查设置好像没什么问题,用sqlplus也可以正常操作orcl 问题找到了,其实可简单,https://localhost:1158/em/console/logon/ ...
- [一个经典的多线程同步问题]解决方案一:关键段CS
前面提出了一个经典的多线程同步互斥问题,本篇将用关键段CRITICAL_SECTION来尝试解决这个问题. 本文先介绍如何使用关键段,然后再深层次的分析下关键段的实现机制和原理. 关键段CRITICA ...
- Mysql 库、表、字段 字符集
show character set;show create database aloe;show create table book_category;show full columns from ...
- 一周学会Mootools 1.4中文教程:(2)函数
温故: 透过对上一节课的学习,相信大家对mt的选择器应该有了一定的认识了,我再放几个小示例让大家对选择器的复杂应用有所了解: <!DOCTYPE html PUBLIC "-//W3C ...