AJAX跨域问题.pdf

那么知道什么是Jsonp和pjax吗？ 答案： Jsonp：(JSONwithPadding)是一种跨域请求方式。主要原理是利用了script 标签可以跨域请求的特点，由其 src 属性发送请求到服务器，服务器返回 js 代 码，网页端接受响应，然后就直接执行了，这和通过 script 标签引用外部文件 的原理是一样的。JSONP 由两部分组成：回调函数和数据，回调函数一般是由网 页端控制，作为参数发往服务器端，服务器端把该函数和数据拼成字符串返回。 pjax：pjax是一种基于ajax+history.pushState的新技术，该技术可以无刷 新改变页面的内容，并且可以改变页面的URL。（关键点：可以实现ajax无法实 现的后退功能）pjax是ajax+pushState的封装，同时支持本地存储、动画等多 种功能。目前支持jquery、qwrap、kissy等多种版本。 jQuery Ajax 简单的实现跨域请求 html 代码清单： script type text/javascript src /js/jquery-1.4.2.min.js/script script type text/javascript $(function(){ $.ajax( { type:get, url : /validate.php?loginuser leeloginpass 123456 , dataType : jsonp, jsonp:jsoncallback, success : function(data) { alert(用户名：+ data.user + 密码：+ data.pass); }, error : function() { alert(fail); } } ); }) /script 服务端 validate.php 代码清单： ?php header(Content-Type:text/html;Charset utf-8); $arr array( user $_GET[loginuser], pass $_GET[loginpass], name response ); echo $_GET[jsoncallback] . (.json_encode($arr).); 效果图： AJAX 跨域请求 - JSONP获取JSON数据 博客分类：  Javascript /Jquery / Bootstrap / Web AsynchronousJavaScriptandXML (Ajax ) 是驱动新一代 Web 站点 （流行术语为 Web 2.0 站点）的关键技术。Ajax 允许在不干扰 Web 应用程序的显示和行为的情况下在后台进行数 据检索。使用 XMLHttpRequest 函数获取数据，它是一种 API，允许客户端 JavaScript 通 过 HTTP 连接到远程服务器。Ajax 也是许多 mashup 的驱动力，它可将来自多个地方的内 容集成为单一 Web 应用程序。 不过，由于受到浏览器的限制，该方法不允许跨域通信。如果尝试从不同的域请求数据，会 出现安全错误。如果能控制数 据驻留的远程服务器并且每个请求都前往同一域，就可以避 免这些安全错误。但是，如果仅停留在自己的服务器上，Web 应用程序还有什么用处呢？如 果需要从多个第三方服务器收集数据时，又该怎么办？ 理解同源策略限制 同源策略阻止从一个域上加载的脚本获取或操作另一个域上的文档属性。也就是说，受到请 求的 URL 的域必须与当前 Web 页面的域相同。这意味着浏览器隔离来自不同源的内容，以 防止它们之间的操作。这个浏览器策略很旧，从 NetscapeNavigator2.0 版本开始就存在。 克服该限制的一个相对简