JQuery Ajax 跨域訪問的解決方案
更新時(shí)間：2010年03月12日 16:56:32 作者：
我們知道ajax本身實(shí)際上是通過XMLHttpRequest對(duì)象來異步進(jìn)行數(shù)據(jù)的交互，而瀏覽器出于安全考慮，不允許js代碼進(jìn)行跨域操作，所以js跨域操作會(huì)被拒絕。
具體情況有:
一、本域和子域的相互訪問: http://www.aa.com/和book.aa.com
二、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 iframe
三、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 XMLHttpRequest訪問代理
四、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 JS創(chuàng)建動(dòng)態(tài)腳本
今天主要討論第4中解決方案，這個(gè)和上個(gè)的區(qū)別就是請(qǐng)求是使用<script>標(biāo)簽來請(qǐng)求的，這個(gè)要求也是兩個(gè)域都是由你來開發(fā)才行。原理就是JS文件注入，在本域內(nèi)的a內(nèi)生成一個(gè)JS標(biāo)簽，它的SRC指向請(qǐng)求的另外一個(gè)域的某個(gè)頁面b，b返回?cái)?shù)據(jù)即可，可以直接返回JS的代碼。因?yàn)閟cript的src屬性是可以跨域的。
這里我們需要用到JQuery.getScript(url, callback)方法，url是腳本文件的URL路勁，callback函數(shù)在腳本資源已被加載和求值后調(diào)用的回調(diào)函數(shù)。
首先在bb.com創(chuàng)建一個(gè)js文件，test.js
var ojb = {msg:'js跨域請(qǐng)求成功'};
然后在aa.com的頁面上使用$.getScript加載test.js腳本
$(function() {
$.getScript('http://www.bb.com/test.js', function() {
if (ojb) {
alert(obj.msg);
}
});
});
使用$.getScript函數(shù)的最大好處就是可以保證，腳本加載完畢后調(diào)用回調(diào)函數(shù)。
個(gè)人感覺這種方法比使用代理和iframe要簡單一些。
一、本域和子域的相互訪問: http://www.aa.com/和book.aa.com
二、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 iframe
三、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 XMLHttpRequest訪問代理
四、本域和其他域的相互訪問: http://www.aa.com/和http://www.bb.com/ 用 JS創(chuàng)建動(dòng)態(tài)腳本
今天主要討論第4中解決方案，這個(gè)和上個(gè)的區(qū)別就是請(qǐng)求是使用<script>標(biāo)簽來請(qǐng)求的，這個(gè)要求也是兩個(gè)域都是由你來開發(fā)才行。原理就是JS文件注入，在本域內(nèi)的a內(nèi)生成一個(gè)JS標(biāo)簽，它的SRC指向請(qǐng)求的另外一個(gè)域的某個(gè)頁面b，b返回?cái)?shù)據(jù)即可，可以直接返回JS的代碼。因?yàn)閟cript的src屬性是可以跨域的。
這里我們需要用到JQuery.getScript(url, callback)方法，url是腳本文件的URL路勁，callback函數(shù)在腳本資源已被加載和求值后調(diào)用的回調(diào)函數(shù)。
首先在bb.com創(chuàng)建一個(gè)js文件，test.js
復(fù)制代碼 代碼如下:
var ojb = {msg:'js跨域請(qǐng)求成功'};
然后在aa.com的頁面上使用$.getScript加載test.js腳本
復(fù)制代碼 代碼如下:
$(function() {
$.getScript('http://www.bb.com/test.js', function() {
if (ojb) {
alert(obj.msg);
}
});
});
使用$.getScript函數(shù)的最大好處就是可以保證，腳本加載完畢后調(diào)用回調(diào)函數(shù)。
個(gè)人感覺這種方法比使用代理和iframe要簡單一些。
相關(guān)文章
基于twbsPagination.js分頁插件使用心得(分享)
下面小編就為大家?guī)硪黄趖wbsPagination.js分頁插件使用心得(分享)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-10-10
DOM操作和jQuery實(shí)現(xiàn)選項(xiàng)移動(dòng)操作的簡單實(shí)例
下面小編就為大家?guī)硪黄狣OM操作和jQuery實(shí)現(xiàn)選項(xiàng)移動(dòng)操作的簡單實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
下面小編就為大家?guī)硪黄钊肜斫鈐Query之防止冒泡事件。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
Jquery css函數(shù)用法(判斷標(biāo)簽是否擁有某屬性)
Jquery css函數(shù)用法(判斷標(biāo)簽是否擁有某屬性) ，需要的朋友可以參考下。2011-05-05
jQuery實(shí)現(xiàn)用戶信息表格的添加和刪除功能
這篇文章主要介紹了jQuery實(shí)現(xiàn)用戶信息表格的添加和刪除功能,代碼簡單易懂，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2017-09-09
jQuery操作Dom元素與遍歷以及JS遍歷詳細(xì)講解
這篇文章主要介紹了jQuery操作Dom元素、jQuery遍歷、JavaScript遍歷，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧2023-01-01
jQuery+ThinkPHP實(shí)現(xiàn)圖片上傳
這篇文章主要為大家詳細(xì)介紹了jQuery+ThinkPHP實(shí)現(xiàn)圖片上傳，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-07-07
jquery隨意添加移除html的實(shí)現(xiàn)代碼
jquery隨意添加移除html的實(shí)現(xiàn)代碼，需要的朋友可以參考下。2011-06-06
通過JQuery，JQueryUI和Jsplumb實(shí)現(xiàn)拖拽模塊
這篇文章主要介紹了通過JQuery，JQueryUI和Jsplumb實(shí)現(xiàn)拖拽模塊，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，,需要的朋友可以參考下2019-06-06
對(duì)于JQuery是啥東東的描述我在此也就不多說了,哈,如果有興趣的話我相信不會(huì)懶的去查吧,哈^^2009-07-07