`
struts
  • 浏览: 76287 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

javascript

阅读更多
看看baidu是如何AJAX跨域的
最近做个人网站遇到AJAX跨子域名的问题。

偶尔看到baidu的通行证处理都是在二级域名passport.baidu.com中处理的,
但是baidu很多地方登录都好像是用ajax处理的,他是怎么做的呢?研究了一下,发现一个小技巧。
不防让大家也借鉴一下。
在http://zhidao.baidu.com/ 未登录用户回答问题时会用iframe调用http://zhidao.baidu.com/userlogin.html
userlogin.html有下面的javascript


<SCRIPT LANGUAGE="JavaScript">
document.domain="baidu.com";
<!--
function G(id){if(typeof(id)=="string"){return document.getElementById(id);}return id;}
function showInfo(obj){
    if(obj.checked == true){
        G("memInfo").style.display="block";
    }else{
        G("memInfo").style.display="none";
    }
}
function request(id,url){
    oScript = document.getElementById(id);
    var head = document.getElementsByTagName("head").item(0);
    if (oScript) {
        head.removeChild(oScript);
    }
    oScript = document.createElement("script");
    oScript.setAttribute("src", url);
    oScript.setAttribute("id",id);
    oScript.setAttribute("type","text/javascript");
    oScript.setAttribute("language","javascript");
    head.appendChild(oScript);
    return oScript;
}
var loginTimer=null;
var loginState=-1;
var tryTime=0;
function PSP_ik(isOk){
    if(isOk==0){
        G("errorInfo").style.display="none";
        loginState=1;
        if(parent.loginSuccess){
            parent.Pop.hide();
            parent.loginSuccess();
        }
    }
    else
    {
        loginFalse();
    }
}

function loginFalse(){
    loginState=0;
    var err=G("errorInfo");
    err.innerHTML="用户名或密码错误,请重新登录";
    err.style.display="block";
    G("username").focus();
    tryTime++;
    if(tryTime>1){
        onLoginFailed();
    }
}
function onLoginFailed(){
    if(parent.onLoginFailed){
        parent.Pop.hide();
        parent.loginFailed();
    }else{
        document.login.u.value=escape("http://zhidao.baidu.com/q"+parent.location.search);
        doucment.login.submit();
    }
       
}
function loginTimeout(){
    if(loginState==-1){
        var err=G("errorInfo");
        err.innerHTML="操作超时,请重新登录";
        err.style.display="block";
        G("username").focus();
    }
}
function userLogin(){
    var username=G('username').value;
    var password=G('password').value;
    var memPassport=G('memPassport').checked?"on":"off";
    if(username.length <=0||password.length <=0){G("username").focus();return false;}
    var url = 'https://passport.baidu.com/?logt&tpl=ik&t=0&keyname=ik&mem_pass='+memPassport+'&username='+username + '&loginpass=' +escape(password)+ '&s=' + (new Date()).getTime();
    loginState=-1;
    var login=request("loginScript",url);
    loginTimer = setTimeout(loginTimeout, 5000);

}
window.onload=function(){
    document.loginForm.username.focus();   
    document.getElementById("username").focus();
}
//-->
</SCRIPT>

我们可以看到request方法处理异步请求使用动态往head中添加script而不是用xmlhttp发送get请求。
妙就妙在这。我们知道调用javascript是没有域的限制的。当加载完成时一样会执行。

当然请求参数只能通过拼url的方式了。
url通过服务器处理后直接输出loginFalse()或者PSP_ik();
非常优雅的解决了跨域的问题。

这让我们想到了用iframe当ajax上传文件一样异曲同工。
如果不需要服务器反馈,google的点击计数用new img().src=...;

当然baidu这段脚本中还有一些小的技巧也值得我们学习。

总结一句 活学活用 不要钻牛角尖,要不等我们解决ajax跨域的时候花儿也谢了
分享到:
评论

相关推荐

    深入理解JavaScript系列

    本书是一本全面、深入介绍JavaScript语言的学习指南。本书共分四个部分,第1部分帮助读者快速入手,掌握基本的JavaScript编程要点;第2部分介绍JavaScript的发展和技术背景;第3部分深入探索JavaScript,介绍了语法...

    Effective JavaScript: 68 Specific Ways to Harness the Power of JavaScript[EPUB版]

    Author David Herman, with his years of experience on Ecma’s JavaScript standardization committee, illuminates the language’s inner workings as never before—helping you take full advantage of ...

    VS2015安装证书,JavaScript_ProjectSystem.msi,JavaScript_LanguageService.msi

    在这个场景中,我们关注的是VS2015的安装过程中涉及到的证书问题以及两个特定的组件:JavaScript_ProjectSystem.msi和JavaScript_LanguageService.msi。 首先,关于“VS2015安装证书”,这通常是指安装过程中需要...

    《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf

    《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf《JavaScript程序设计案例教程》课件(共13章)第1章 JavaScript程序设计案例教程.pdf《JavaScript程序设计案例教程》课件(共13章)第...

    web期末大作业 基于HTML+CSS+JavaScript实现的精美电商购物网站首页源码

    web期末大作业 基于HTML+CSS+JavaScript实现的精美电商购物网站首页源码 web期末大作业 基于HTML+CSS+JavaScript实现的精美电商购物网站首页源码 web期末大作业 基于HTML+CSS+JavaScript实现的精美电商购物网站首页...

    面向对象JavaScript精要(英文原版pdf)

    ### 面向对象JavaScript精要 #### 一、书籍概览 本书《面向对象JavaScript精要》由Nicholas C. Zakas编写,是面向对象编程领域中的权威指南之一,尤其针对JavaScript这门语言。作者深入浅出地介绍了面向对象编程的...

    ArcGis-for-javaScript最全中文API.pdf

    ArcGIS JavaScript API 介绍与示例 ArcGIS JavaScript API 是 ESRI 提供的一种基于 JavaScript 的开发工具,允许开发者创建交互式的 Web 地图应用程序。本文将对 ArcGIS JavaScript API 进行详细的介绍,并提供多个...

    [JavaScript权威指南(第6版)]

    《JavaScript权威指南(第6版)》主要讲述的内容涵盖JavaScript语言本身,以及Web浏览器所实现的JavaScript API。本书第6版涵盖了HTML5和ECMAScript 5,很多章节完全重写,增加了当今Web开发的最佳实践的内容,新增...

    JavaScript结课大作业.zip

    JavaScript是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责实现客户端的交互效果、动态更新内容以及处理用户输入。在"JavaScript结课大作业.zip"这个压缩包中,我们可以推测这是一份关于JavaScript编程的...

    JavaScript权威指南(第6版)(中文版)

    《JavaScript权威指南(第6版)》全面介绍了JavaScript语言的核心,以及Web浏览器中实现的遗留和标准的DOM。它运用了一些复杂的例子,说明如何处理验证表单数据、使用cookie、创建可移植的DHTML动画等常见任务。...

    JavaScript基础语法(ppt)

    JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)JavaScript基础语法(ppt)...

    JavaScript前端开发案例教程-源代码.rar

    JavaScript,作为全球最广泛使用的编程语言之一,是前端开发的核心技术。这个名为"JavaScript前端开发案例教程-源代码.rar"的压缩包文件提供了一系列实践案例,帮助开发者深入理解和掌握JavaScript在网页开发中的...

    Javascript 高级程序设计(第3版)超清中文PDF

    JavaScript,作为一种广泛应用于Web开发的脚本语言,已经成为现代互联网技术不可或缺的一部分。《JavaScript高级程序设计》(第3版)是一本深入探讨该语言精髓的权威书籍,它为读者提供了全面且深入的JavaScript知识...

    JavaScript DOM编程艺术【第2版&高清】.pdf

    但是,根据标题《JavaScript DOM编程艺术【第2版&高清】.pdf》和描述“JavaScript DOM编程艺术,高清资源,无比经典,值得拥有”,我们可以推断这本书主要讲述了JavaScript中DOM(文档对象模型)的相关编程技术。...

    JavaScript&jQuery;交互式Web前端开发

    通过将编程理论与用来演示JavaScript和jQuery如何被应用于流行站点之上的示例相结合,《JavaScript&jQuery;交互式Web前端开发》将教会您如何让网站更具交互性、吸引性、可用性。很快,您就能够像一名程序员那样去...

    [JavaScript] Effective JavaScript 编写高质量JavaScript代码的68个有效方法 (英文版)

    [Addison-Wesley Professional] Effective JavaScript 编写高质量JavaScript代码的68个有效方法 (英文版) [Addison-Wesley Professional] Effective JavaScript 68 Specific Ways to Harness the Power of ...

    arcgis api for javascript 中文帮助文档和demo

    《ArcGIS API for JavaScript 中文帮助文档与Demo详解》 ArcGIS API for JavaScript 是Esri公司提供的一款强大的JavaScript库,用于构建交互式的地理信息系统(GIS)应用。它为开发者提供了丰富的功能,包括地图...

    JavaScript基础教程(pdf版)

    本教程旨在为初学者提供一个全面的JavaScript基础知识学习平台,帮助理解并掌握这种强大的脚本语言。 《JavaScript基础教程》首先会介绍JavaScript的历史背景和基本语法,包括变量、数据类型、操作符、流程控制...

    JavaScript手册 JavaScript手册

    JavaScript是一种广泛应用于网页和网络应用的编程语言,尤其在客户端脚本方面扮演着核心角色。JavaScript手册是学习和掌握这门语言的重要参考资料。手册通常包含了语言的基础语法、数据类型、控制结构、函数、对象、...

    JavaScript入门经典(第3版)高清PDF—3

    《JavaScript入门经典(第3版)》首先介绍了JavaScript的基本语法,并介绍了如何发挥JavaScript中对象的威力。《JavaScript入门经典(第3版)》还介绍了如何操纵最新版本浏览器所提供的BOM对象。在《JavaScript入门经典...

Global site tag (gtag.js) - Google Analytics