概述
AJAX案例研究之Gmail （转）
原帖( http://www.blogjava.net/emu/archive/2005/11/04/18139.html )
现在提起AJAX，大家都立刻会想起Gmail、gogle map这几个经典的AJAX应用。Gmail的优良表现我们都看过了，那么它的实现你研究过了吗？它怎么在几个不同的浏览器上可以一致的实现xml异步调用的呢？一起来看看吧。
首先，登录gmail以后我们会先进入这个页面：
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Gmail</title>
<link rel="alternate" type="application/atom+xml" title="Gmail Atom Feed" href="feed/atom" />
<script src="?view=page&name=browser&ver=c0d3d44c64799453"></script>
</head>
<noscript>
<font face=arial>
应启用 JavaScript，才能在标准视图中使用 Gmail。然而，JavaScript 似乎已被禁用，要么就是您的浏览器不支持 JavaScript。要使用标准视图，请更改您的浏览器选项以启用 JavaScript，然后<a href="">重试</a>。<p>要使用 Gmail 的基本 HTML 视图（不需要 JavaScript），<a href="?ui=html&zy=n">请单击此处</a>。</p>
</font>
</noscript>
<script>
<!--
var fs_time = (new Date()).getTime();
function wfs() {
try {
if (parent != window && parent.wfs) {
return false;
}
} catch(e) {
}
if (top.location.href.indexOf('nocheckbrowser') != -1) {
return true;
}
if (!is_browser_supported) {
top.location = '?ui=html&zy=j';
return false;
}
var testcookie = 'jscookietest=valid';
document.cookie = testcookie;
if (document.cookie.indexOf(testcookie) == -1) {
top.location = 'html/zh-CN/nocookies.html';
return false;
}
document.cookie = testcookie + ';expires=' + new Date(0).toGMTString();
var agt = navigator.userAgent.toLowerCase();
if (agt.indexOf('msie')!= -1 && document.all &&agt.indexOf('opera') == -1 && agt.indexOf('mac') == -1) {
eval("var control = (agt.indexOf('msie 5') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP';try {new ActiveXObject(control);} catch (e) {top.location = 'html/zh-CN/noactivex.html';}");
}
return true;
}
function lj() {
js.location.replace('?view=page&name=js&ver=d6079057e81abd3c');
}
if (wfs()) {
document.write("<frameset οnlοad=lj() rows="100%,*" border=0><frame name=main src=html/zh-CN/loading.html frameborder=0 noresize scrolling=no><frame name=js src=html/zh-CN/loading.html frameborder=0 noresize></frameset>");}
//-->
</script>
</html>
这是主框架网页兼浏览器检测页。如果浏览器通过了检测（支持javascript、cookie和xml控件）则在页面上写一段框架代码
要注意到的是google在这里耍了一个小花招，那个叫做main的框架页面里面看来没有多少东西，好东东都在那个叫js的框架里面呢。
我们接着把这个js框架拉出来看看：
其实其中大部分都是老生常谈的js代码了，不过我们可以一窥google的编码风格：尽可能压缩信息量，变量名能用一个字母的绝不用两个，函数名一概都是两个字母的，函数内的会车是没有的，缩进也是没有的。虽然代码没有特地加密，但是如此处理一番之后也就没什么可读性了。还好系统的关键字是不能缩水的，顺着xml控件的名字我们可以揪出来跟AJAX异步加载数据相关的几个关键函数：
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
这个页面有240多k，几乎全都是javascript代码。有兴趣分析的兄弟姐妹们请点这里下载。
其实其中大部分都是老生常谈的js代码了，不过我们可以一窥google的编码风格：尽可能压缩信息量，变量名能用一个字母的绝不用两个，函数名一概都是两个字母的，函数内的会车是没有的，缩进也是没有的。虽然代码没有特地加密，但是如此处理一番之后也就没什么可读性了。还好系统的关键字是不能缩水的，顺着xml控件的名字我们可以揪出来跟AJAX异步加载数据相关的几个关键函数：
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
这个页面有240多k，几乎全都是javascript代码。有兴趣分析的兄弟姐妹们请点这里下载。
<html>
<head>
<meta content="text/html; charset=UTF-8" http-equiv="content-type">
<title>Gmail</title>
<link rel="alternate" type="application/atom+xml" title="Gmail Atom Feed" href="feed/atom" />
<script src="?view=page&name=browser&ver=c0d3d44c64799453"></script>
</head>
<noscript>
<font face=arial>
应启用 JavaScript，才能在标准视图中使用 Gmail。然而，JavaScript 似乎已被禁用，要么就是您的浏览器不支持 JavaScript。要使用标准视图，请更改您的浏览器选项以启用 JavaScript，然后<a href="">重试</a>。<p>要使用 Gmail 的基本 HTML 视图（不需要 JavaScript），<a href="?ui=html&zy=n">请单击此处</a>。</p>
</font>
</noscript>
<script>
<!--
var fs_time = (new Date()).getTime();
function wfs() {
try {
if (parent != window && parent.wfs) {
return false;
}
} catch(e) {
}
if (top.location.href.indexOf('nocheckbrowser') != -1) {
return true;
}
if (!is_browser_supported) {
top.location = '?ui=html&zy=j';
return false;
}
var testcookie = 'jscookietest=valid';
document.cookie = testcookie;
if (document.cookie.indexOf(testcookie) == -1) {
top.location = 'html/zh-CN/nocookies.html';
return false;
}
document.cookie = testcookie + ';expires=' + new Date(0).toGMTString();
var agt = navigator.userAgent.toLowerCase();
if (agt.indexOf('msie')!= -1 && document.all &&agt.indexOf('opera') == -1 && agt.indexOf('mac') == -1) {
eval("var control = (agt.indexOf('msie 5') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP';try {new ActiveXObject(control);} catch (e) {top.location = 'html/zh-CN/noactivex.html';}");
}
return true;
}
function lj() {
js.location.replace('?view=page&name=js&ver=d6079057e81abd3c');
}
if (wfs()) {
document.write("<frameset οnlοad=lj() rows="100%,*" border=0><frame name=main src=html/zh-CN/loading.html frameborder=0 noresize scrolling=no><frame name=js src=html/zh-CN/loading.html frameborder=0 noresize></frameset>");}
//-->
</script>
</html>
这是主框架网页兼浏览器检测页。如果浏览器通过了检测（支持javascript、cookie和xml控件）则在页面上写一段框架代码
要注意到的是google在这里耍了一个小花招，那个叫做main的框架页面里面看来没有多少东西，好东东都在那个叫js的框架里面呢。
我们接着把这个js框架拉出来看看：
其实其中大部分都是老生常谈的js代码了，不过我们可以一窥google的编码风格：尽可能压缩信息量，变量名能用一个字母的绝不用两个，函数名一概都是两个字母的，函数内的会车是没有的，缩进也是没有的。虽然代码没有特地加密，但是如此处理一番之后也就没什么可读性了。还好系统的关键字是不能缩水的，顺着xml控件的名字我们可以揪出来跟AJAX异步加载数据相关的几个关键函数：
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
// emu注释 构造XML控件并返回给调用者
function ot(a,b){; try {a.send(b)} catch (c){q(c); if (c.number ==- 2146697208 ){alert( " 请确保 Internet Explorer 的”语言
”设置部分不是空白。
"
)}}}// emu注释 执行发送数据操作 a:XML控件 b:要发送的数据
function Wf(a,b,c){Da( 3 );b = Ld(b);Hf(a,b,c)}
// emu注释 a:XML控件 b:访问的url c:回调函数 Da是验证参数长度的函数
// Ld是一个url转换加工的函数，主要处理url自带的CGI参数和翻页的页数等
function Hf(a,b,c){Da( 3 );a.onreadystatechange = c;a.open( " GET " ,b, true );ot(a, null )}
// emu注释 不发送数据直接请求资源 a:XML控件 b:访问的url c:回调函数
function nt(a,b,c,d){Da( 4 );a.onreadystatechange = d;a.open( " POST " ,b, true );ot(a,c)}
// emu注释 发送数据并请求资源 a:XML控件 b:访问的url c:要发送的数据 d:回调函数
基本上就这么多了，很失望吧，没有什么新鲜的东西。发送http请求之后它又怎么处理返回的xml的呢？事实上他没有处理。他所处理的仅仅是最基本responseText，而cgi则直接生成js脚本到客户端回调(用eval运行)，或者生成文本信息。这就是为什么gmail可以轻松跨域几个浏览器了。
作为最受推崇的一个AJAX应用，却几乎没有用到xml。像这样用xml控件来收发文本信息后在页面上展现的技术，基本上就是现在AJAX最流行的应用方式了，不过这样也能叫AJAX吗？我宁可就叫它AJ，最多叫AJAH。
今天先到这，下回再过来分析另一个完全不同的AJAX应用吧。大家周末愉快！
这个页面有240多k，几乎全都是javascript代码。有兴趣分析的兄弟姐妹们请点这里下载。
其实其中大部分都是老生常谈的js代码了，不过我们可以一窥google的编码风格：尽可能压缩信息量，变量名能用一个字母的绝不用两个，函数名一概都是两个字母的，函数内的会车是没有的，缩进也是没有的。虽然代码没有特地加密，但是如此处理一番之后也就没什么可读性了。还好系统的关键字是不能缩水的，顺
最后
以上就是完美篮球为你收集整理的AJAX案例研究之Gmail （转）的全部内容，希望文章能够帮你解决AJAX案例研究之Gmail （转）所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复