ajax 跨域解決問題

字號:


    ajax跨域問題,這里使用 jsonp 來完成,該方式有一個弊端,在提交POST請求的時候,它依然會使用GET的方式傳遞參數(shù),這點目前還沒有解決。
    首先 得了解JSONP這種類型返回的值的格式,(callback(數(shù)據(jù))) 這里并不像普通的HTTP請求那樣,只要服務端返回數(shù)據(jù)就可以直接將該數(shù)據(jù)拿來使用,它的區(qū)別在于 JSONP 會將數(shù)據(jù)放到一個回調方法里面。
    其次 我們來完成服務端的數(shù)據(jù)處理
    //這里使用PHP語言來處理服務端的數(shù)據(jù)
    /**
    * 獲取數(shù)據(jù)
    * 2014-12-25
    * comfiger
    **/
    public function getData(){
    $jsonCallback = $_GET['jsonCallback']; //回去在客戶端JS中定義的回調處理方法名稱
    $array = array(
    'name' => 'comfiger',
    'age' => '25',
    'sex' => '男',
    'job' => '服務端軟件開發(fā)'
    );
    //將數(shù)據(jù)封裝城 JSON 格式
    $json = json_encode($array);
    //將JSON數(shù)據(jù)輸出到 $jsonCallback 方法中
    echo "$jsonCallback($json)";
    }
    最后 在客服端訪問服務端數(shù)據(jù)
    //使用ajax方式調用
    $.ajax({
    url: 'http://192.168.0.105/getData?jsonCallback=?',
    dataType: 'jsonp',
    jsonp: 'callback', //jsonp回調處理函數(shù),默認為: callback
    type: 'get',
    success: function(data){
    //console.log('jsonpData: ' + JSON.stringify(data));
    //這里獲取到的值為: callback({name: 'comfiger', age: '25', ....});
    //這樣看返回值就清楚的明白調用成功后,它會繼續(xù)調用 callback方法
    }
    });
    //定義回調callback方法處理
    var callback = function(data){
    console.log('callbackData: ' + JSON.stringify(data));
    //do something...
    }