用戶端:
使用$.getJSON()在傳輸第一個參數,也就是url時,如果是跨域請求一定要有一個參數的值為“?”,如:
代碼如下 |
複製代碼 |
$.getJSON( "http://202.196.35.41/json.php?callback=?", function(data){ alert(data); } }; |
jQuery在發送請求時會將這個“?”替換為一個唯一的字串,如下圖
並且聲明一個與這個字串名稱相同變數,將傳入的回掉函數賦值給這個變數。
服務端:
服務端一定是動態程式,不能是靜態文字檔,因為服務端要接收到傳過來的函數名,就是上圖中callback的值jQuery172031288272701203823_1344179936251。
然後服務端構造一個函數調用型的字串,將需要發送給用戶端的值做為參數。
也就是:jQuery172031288272701203823_1344179936251([這裡傳參數JSON資料])。
上PHP代碼。
代碼如下 |
複製代碼 |
<?php header('Content-Type:text/javascript; charset=utf-8'); class User{ public $id; public $name; public function __construct($id, $name){ $this->id = $id; $this->name = $name; } } $users = array(new User(1, 'admin'), new User(2, 'root')); echo $_REQUEST['callback'].'('.json_encode($users).')'; |
Ajax得到的資料:
jQuery172031288272701203823_1344179936251([{"id":1,"name":"admin"},{"id":2,"name":"root"}])用戶端得到這個資料之後就執行這條語句,由於前面已經將$.getJSON()傳入的回掉函數指定了同樣的函數名,此時就會調用傳入的函數,並將資料傳入。
具體的跨域請求是利用了頁面中可以引入其他域的js檔案這個性質,在頁面中建立一個script節點,將他的src屬性指向其他域的動態檔案。瀏覽器就會載入這個檔案並執行其中的指令碼