jsonp跨域請求,動態script標簽實現跨域


1、什么是跨域

首先一個域名地址的組成是:

http://www.xxx.com:8080/xxx/xxx.jsp

協議子域名主域名端口號請求資源地址

當協議、子域名、主域名、端口號中任意一個不相同時,都算作是不同域。

不同域之間相互請求資源,就算作“跨域”。而這是被瀏覽器的安全機制所禁止的。

2、這里要說的是處理跨域其中一個方法——jsonp

jsonp可用於解決主流瀏覽器的跨域數據訪問的問題,其中的原理是利用<script>元素的跨域能力

科普基礎知識:web頁面上凡是擁有“src”這個屬性的標簽都擁有跨域的能力,比如<script>,<img>

JSONP,JSON width Padding,采用json 作為傳輸數據的載體,具體的實現通過script標簽跨域應用來完成。

3、實現方法說明

a,客戶端(我的域名)頁面代碼控制

b,服務端(提供服務和數據)的數據可控。

4、舉例實現方法

<script type="text/javascript">

//////////////////////////////////
// jQuery的調用
//////////////////////////////////
$.ajax({
crossDomain :true,
url: 'http://s.weibo.com/ajax/jsonp/suggestion?key=a', //不同的域
type: 'GET', // jsonp模式只有GET是合法的
dataType: 'jsonp', // 數據類型
jsonp: '_cb', // 指定回調函數名,與服務器端接收的一致,並回傳回來
success: function(data) {
console.log(data);
}
});

//////////////////////////////////
// jsonp的原理
//////////////////////////////////
//服務器調用的全局函數,用來接受數據
function getResult(o) {
console.log(o.data);
}

</script>
<script type="text/javascript" src="http://s.weibo.com/ajax/jsonp/suggestion?_cb=getResult"></script>

例子中用的是微博API,查看更多http://open.weibo.com/wiki/%E5%BE%AE%E5%8D%9AAPI

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM