一，目前主流的JSONP颠焦，這個名字的來源是jq的Ajax請求有現(xiàn)成的封裝好了的跨域方法，只需要在Ajax請求里設(shè)置一個dataType屬性等于jsonp即可：
$.ajax({??
????????type?:?"get",??
????????async:false,??
? ? ? ? url?:?"http://xxxx.com/index.html?sid=1494&busiId=101",
????????dataType?:?"jsonp",//數(shù)據(jù)類型為jsonp??
????????jsonp:?"jsonpCallback",//服務(wù)端用于接收callback調(diào)用的function名,實(shí)際可以不填??
????????success?:?function(data){
? ? ? ? ? ? 上面jsonp參數(shù)可以不填往枣，因?yàn)閖q會把返回值放到success里設(shè)置此處的回調(diào)伐庭，所以實(shí)際上像平常的ajax請求那樣寫即可
? ? ? ? },??
????????error:function(){? ? ?alert('fail');? ? ? ?}??
????});??
jsonp的原理實(shí)則很簡單，相當(dāng)于利用了一個瀏覽器的漏洞分冈，因?yàn)槠匠Ｔ贖TML里引入資源時無論是css圾另、圖片、script都是可以不分站點(diǎn)的雕沉，也就是自帶了跨域集乔，此時我們只需用js創(chuàng)建一個script標(biāo)簽，把src設(shè)置成服務(wù)器的地址蘑秽，并把回調(diào)加在src(即http:xxxx.com/index.html?callback=xxxxx)饺著，此時服務(wù)器配合截取callback，然后返回此callback的參數(shù)調(diào)用(即返回一個可執(zhí)行的JS代碼)肠牲，就實(shí)現(xiàn)了跨域并回調(diào)的效果。
此方式的好處是兼容性好靴跛，瀏覽器都支持缀雳，但安全性不夠高，且只不支持POST請求梢睛，即使發(fā)的是post請求肥印，也會變?yōu)間et。
二绝葡、W3C推薦的CORS深碱，此種方式是標(biāo)準(zhǔn)推薦的，是一個更好的方式藏畅，也是未來的方式敷硅，前端的實(shí)現(xiàn)方式很簡單，只是在原生的http請求基礎(chǔ)上，在設(shè)置請求頭部信息時绞蹦，要多設(shè)置一個Origin屬性力奋，把此屬性指向服務(wù)器允許的地址即可：
? ?var?xhr =?new?XMLHttpRequest();
????xhr.open("post",?"http://xxxxx.com/index.html",?true);
????xhr.setRequestHeader("Content-Type",?"application/x-www-form-urlencoded");
????// 聲明請求源
????xhr.setRequestHeader("Origin",?"http://example.com");
????xhr.onreadystatechange =?function?() {
????????if?(xhr.readyState == 4 && xhr.status == 200) {
????????????var?responseText = xhr.responseText;
????????????console.info(responseText);
????????}
????}
????xhr.send();
此方式的好處是安全且是標(biāo)準(zhǔn)推薦的，缺點(diǎn)是ie10以下的瀏覽器不支持幽七，所以導(dǎo)致它尚未能成為主流方式景殷。
