什么是跨域以及跨域解决方法

一、什么是跨域

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

当前页面url	被请求页面url	是否跨域	原因
http://www.test.com	http://www.test.com/a.html	否	同源（协议、域名、端口号相同）
http://www.test.com	https://www.test.com/a.html	跨域	协议不同（http/https）
http://www.test.com	http://www.baidu.com/	跨域	主域名不同（test/baidu）
http://www.test.com	http://a.test.com/	跨域	子域名不同（www/blog）
http://www.test.com:8080	http://www.test.com:1234/	跨域	端口号不同（8080/7001）

 

二、跨域解决方法

出于安全的考虑，浏览器允许跨域写，而不允许跨域读

(1)法一：设置header头

header("Access-Control-Allow-Origin: *"); （在该方法最开始处加上）

访问控制允许同源"，这是由于ajax跨域访问引起的

(2)法二：jsonp (ajax跨域)

如：

  $(document).ready(function(){

   var url='http://localhost:8080/WorkGroupManagment/open/getGroupById"

       +"?id=1&callback=?';

   $.ajax({

     url:url,

     dataType:'jsonp',

     processData: false,

     type:'get',

     success:function(data){

       alert(data.name);

     },

     error:function(XMLHttpRequest, textStatus, errorThrown) {

       alert(XMLHttpRequest.status);

       alert(XMLHttpRequest.readyState);

       alert(textStatus);

     }});

   });

（3）比较一下json与jsonp格式的区别：

json格式：

{

    "message":"获取成功",

    "state":"1",

    "result":{"name":"工作组1","id":1,"description":"11"}

}

jsonp格式：

callback({

    "message":"获取成功",

    "state":"1",

    "result":{"name":"工作组1","id":1,"description":"11"}

})

jsonp比json外面有多了一层，callback()。