使用jsonp解決跨域請求
由于同源策略的限制,在一個源下只允許請求當前源(域名、協議、端口)的資源。如果要在當前源下請求另一個源的數據,就是跨域請求了.最近碰到這個問題,上網找了一些資料發現用JSONP可以解決跨域請求的問題,特此記錄下來.JSONP是一個非官方的協議,它允許在服務器端集成script tags返回至客戶端,通過javascript callback的形式實現跨域訪問。也就是我們可以通過客戶端使用html的script標記來跨域請求服務端,服務端響應中返回一段script代碼,來回調客戶端的一個javascript函數.可以直接使用JSON傳遞javascript對象。
具體使用方式是這樣的:
假定現在有兩個域:
域A:client.com
域B:server.com
現在client.com需要訪問server.com獲得一些數據,就可在client.com的頁面中嵌入
下面這樣的代碼:
<script type="text/javascript">
// 服務端返回數據的回調函數
function callbackFun(result) {
alert(result);
}
// 創建一個script標簽
var requestData = document.createElement("script") ;
requestData.type = "text/javascript";
// src請求指向server端
requestData.src = "http://server.com?param1=xxx¶m2=xxx";
if (heads.length) {
heads[0].appendChild(requestData);
} else {
document.documentElement.appendChild(requestData);
}
</script>
// 服務端返回數據的回調函數
function callbackFun(result) {
alert(result);
}
// 創建一個script標簽
var requestData = document.createElement("script") ;
requestData.type = "text/javascript";
// src請求指向server端
requestData.src = "http://server.com?param1=xxx¶m2=xxx";
if (heads.length) {
heads[0].appendChild(requestData);
} else {
document.documentElement.appendChild(requestData);
}
</script>
上述src的請求在server.com中將返回如下數據:
callbackFun('[{"key1" : "value1}, {"key2" : "value2"}]')
其實這個回調函數里可以返回任何數據,可以是json,可以是xml,可以是一段頁面代碼...
這樣就完成了一次跨域請求
這樣就完成了一次跨域請求
@import url(http://www.aygfsteel.com/CuteSoft_Client/CuteEditor/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/css/cuteeditor.css);
-->槍聲依舊<--
posted @ 2012-03-08 21:43 槍聲依舊 閱讀(1376) | 評論 (0) | 編輯 收藏