跨域一般用jsonp，兼容性比较好。
CORS是html5最新的XHR第二版本，不支持IE8,IE9，对移动端的支持非常好。
但是考虑项目后期这部分会转到同域名下，而且网址不需要支持ie8，ie9，所以我们考虑使用html5最新的跨域资源共享（CORS）来实现跨域请求。

http://a.test.com/cross.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>sub domain</title>

    <link rel="stylesheet" href="css/bootstrap.min.css">

    <link rel="stylesheet" href="css/bootstrap-theme.min.css">

    <link rel="stylesheet" href="css/main.css">

    <script src="js/jquery-1.11.3.js"></script>

    <script src="js/jQuery.XDomainRequest.js"></script>

</head>

<body>

    <h3>跨域限制</h3>

    <button class="btn btn-primary btn-sm" onclick="crossAjax();">跨域请求</button>

    <hr />

    <h3>IE8,9跨域限制</h3>

    <button class="btn btn-primary btn-sm" onclick="ieCrossAjax();">跨域请求</button>

    <hr />

    <script>

    function crossAjax() {

        // var url = 'http://192.168.1.138:8080/msjc-admin/index';

        var url = 'http://b.test.com/test.php';

        $.ajax(url).done(function(data) {

            alert(data.name);

        }).fail(function() {

            alert('请求失败');

        });

    }

    function ieCrossAjax() {

        var url = 'http://b.test.com/test.php';

        // var xdr = new XDomainRequest();

        // xdr.open("get", url);

        // xdr.onload = function() {

        //     var data = JSON.parse(xdr.responseText)

        //     alert(data.name);

        // }

        // xdr.send();

        // GET

        // $.getJSON(url).done(function(data) {

        //     alert(data.name);

        // });

        $.ajax({

            url: url,

            type: 'GET',

            dataType: 'json'

        }).done(function(data) {

            alert(data.name);

        });

        // POST

        // POST

        // $.ajax({

        //     url: url,

        //     data: {

        //         name: 'nuanfeng',

        //         gender: 'boy'

        //     },

        //     contentType: 'text/plain',

        //     type: 'POST',

        //     dataType: 'json'

        // }).done(function(data) {

        //     console.log(data);

        // });

        // $.post(url, {

        //         name: "Donald Duck",

        //         gender: "Duckburg"

        //     },

        //     function(data, status) {

        //         alert("Data: " + data.name + "\nStatus: " + status);

        //     });

    }

    </script>

</body>

</html>

php - server:

<?php

$ret = array(

    'name' => isset($_POST['name'])? $_POST['name'] : 'myName',

    'gender' => isset($_POST['gender'])? $_POST['gender'] : 'myGender'

); 

// $ret = file_get_contents("php://input");

// $ret = $ret=>'name';

// $ret = json_encode($ret);

header('content-type:application:json;charset=utf8');

// 指定可信任的域名来接收响应信息

header('Access-Control-Allow-Origin:*');

// header('Access-Control-Allow-Methods:POST');

// header('Access-Control-Allow-Headers:x-requested-with,content-type');  

echo json_encode($ret);

?>

如果需要支持ie8，ie9，可以判断ie情况下使用XDomainRequest来实现：

var xdr = new XDomainRequest();

xdr.open("get", url);

xdr.onload = function() {

    var data = JSON.parse(xdr.responseText)

    alert(data.name);

}

xdr.send();

上面的cross.html中，我们引入了一个jQuery.XDomainRequest，它就是封装了XDR（XDomainRequest）来支持ie8和ie9. （http://www.tuicool.com/articles/Njiiamm）

关于CORS更详细点的介绍：http://blog.csdn.net/fdipzone/article/details/46390573   http://www.cnblogs.com/yuzhongwusan/p/3677955.html

Ajax跨域：jsonp还是CORS的更多相关文章

  1. ajax跨域请求解决方案 CORS和JSONP

    什么是跨域: 只要协议.域名.端口有任何一个不同,都会被当成不同的域.而由于浏览器的同源策略(同源策略:域名.协议.端口均相同),浏览器之间要隔离不同域的内容,禁止互相操作,不能执行其他网站的js.所 ...

  2. 小结ajax中的同源和跨域 jsonp和cors

    网上的同源和跨域一般都比较复杂,最近也稍微总结了一下: 所谓同源,是浏览器的一种安全机制,作用在于保护网页数据的安全,不同源的网页之间不允许cookie dom ajax等行为 同源的条件:1.协议相 ...

  3. 如何解决 ajax跨域被阻止 CORS 头缺少 'Access-Control-Allow-Origin'的问题？

    已拦截跨源请求:同源策略禁止读取位于 http://192.168.1.72:8080/securityMonitor_TV/service/getTest 的远程资源. (原因:CORS 头缺少 ' ...

  4. jQuery的ajax跨域 Jsonp原理

    1.Jsonp Jsonp(json with padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题. Jsonp是为了解决ajax跨域发送http请求出现的,利用S ...

  5. 【JS】AJAX跨域-JSONP解决方案（一）

    AJAX跨域介绍 AJAX 跨域访问是用户访问A网站时所产生的对B网站的跨域访问请求均提交到A网站的指定页面 由于安全方面的原因, 客户端js使用xmlhttprequest只能用来向来源网站发送请求 ...

  6. AJAX_违反了同源策略_就是"跨域"——jsonp 和 cors

    https 协议    默认端口号 443 http 协议    默认端口号 80 同源策略 由网景公司提出的——浏览器 的 为了浏览器安全而生 同源策略: 协议.域名.端口号    必须完全一致 违 ...

  7. 跨域-jsonp、cors、iframe、document.domain、postMessage()

    同源策略 概念:同源: 协议.域名.端口号 完全相同 同源策略是浏览器的一种安全策略:且浏览器不会将违反同源策略的响应信息返回 http://127.0.0.1:3000/index.html     ...

  8. 由浅入深学习ajax跨域(JSONP)问题

    什么是跨域?说直白点就是获取别人网站上的内容.但这么说貌似又有点混淆,因为通常我们用ajax+php就可以获取别人网站的内容,来看下面这个例子. 来看看跨域的例子,jquery+ajax是不能跨域请求 ...

  9. ajax跨域jsonp

    <!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...

  10. ajax跨域原理和cors跨域资源共享

    不需要设置前端太多,只需要在服务端是在请求头,使服务端的回复数据可以正常通过浏览器的限制,进入网站 首先说下简单请求和非简单请求: 简单请求:必须满足下列条件 1.请求方式:head,get,post ...

随机推荐

  1. SQLite剖析之存储模型

    前言 SQLite作为嵌入式数据库,通常针对的应用的数据量相对于DBMS的数据量小.所以它的存储模型设计得非常简单,总的来说,SQLite把一个数据文件分成若干大小相等的页面,然后以B树的形式来组织这 ...

  2. 数据集偏斜 - class skew problem - 以SVM松弛变量为例

    原文 接下来要说的东西其实不是松弛变量本身,但由于是为了使用松弛变量才引入的,因此放在这里也算合适,那就是惩罚因子C.回头看一眼引入了松弛变量以后的优化问题: 注意其中C的位置,也可以回想一下C所起的 ...

  3. 1001 数组中和等于K的数对 1090 3个数和为0

    二分查找.对数组每个V[i],在其中查找K-V[i],查找完成后修改v[i]避免重复输出 #include<iostream> #include<algorithm> #inc ...

  4. bzoj4443[SCOI2015]小凸玩矩阵

    题意:一个n*m的矩阵(n<=m<=250),要求选出n个数(每行,每列最多选一个),求第k大数的最小值. 首先第k大的意思是从大到小的第k个数(我读错了,WA了一次还以为算法不对...) ...

  5. linux下mnt目录作用

    linux下mnt目录作用 一.mount 英文解释 登上; 爬上; 攀登; 骑上; 乘上; 跨上 可直接理解为“挂载” 挂接光驱.USB设备的目录,加载后,会在mnt里多出相应设备的目录.mnt是m ...

  6. Java之使用Hadoop探索大数据的世界

    什么是大数据 PB = 1024tb 7123913827189tb Reids 无共享 HDFS 优点 :特别适合存储大型文件 TFS hdfs 架构 NameNode: 整个hadoop总管,只有 ...

  7. 12月4日PHPCMS模板

    cms的样式有很多种,我们学习的是phpcms,这些cms都是大同小异,学会了一种就可以使用其它的cms. PHPCMS是一款网站管理软件.该软件采用模块化开发,支持多种分类方式,使用它可方便实现个性 ...

  8. Linux 基本命令

    修改环境变量 vim ~/.bashrc 保存退出,输入以下命令使之立即生效 source ~/.bashrc /etc/profile:在登录时,操作系统定制用户环境时使用的第一个文件,此文件为系统 ...

  9. 旧版本APP被开发人员下架，新版本重新上传依然显示被下架

    新接了一个项目,这个项目在苹果商城上面的版本已经被原来另外一家公司的开发人员下架.我们重新设计.开发.上传,申请加急审核,终于完成手动发布.但是发布成功后,新版本提示:被开发人员下架.以前虽然迭代开发 ...

  10. Node.js API 初解读（二）

    四. Cluster 1.简介 在介绍 Cluster 之前.我们需要知道 node的 一些基本特性,比如说 都知道的 nodejs最大的特点就是单进程.无阻塞运行,并且是异步事件驱动的. 那么随之而 ...