js跨越請求的2中實現 JSONP /後端接口設置運行跨越header

因爲瀏覽器同源策略，a域名的js向b域名ajax請求會被禁止。JS實現跨越訪問接口有2中辦法。

1.後端接口設置容許跨越的header頭。

//header('Access-Control-Allow-Origin:*');  //支持全域名訪問，不安全，部署後須要固定限制爲客戶端網址
header('Access-Control-Allow-Origin:http://www.example-a.com');   //設置的是帶協議的url，而不是一個域名。能夠設置多個url，用逗號分隔
echo json_encode(['name'=>'lucy']);}

　　

　　

  客戶端正常ajax請求便可。

 

2.客戶端經過jsonp請求，服務器不用設置跨越header。關於jsonp原理這裏再也不說，能夠另外查找資料。下面給出個實現的具體方法。

客戶端請求，以jquery實現爲例子

 

<script type="text/javascript">
    $(document).ready(function(){
        $.ajax({
            type : "get",
            async: false,
            url : "http://www.example-a.com/api.php?id=1",
            dataType: "jsonp",
            jsonp:"callback", //請求php的參數名
            //jsonpCallback: "jsonhandle",//要執行的回調函數，（jquery中，這個參數能夠省略，jquery會隨機生成一個名字）
            success : function(data) {
                console.log(data);
            }
        });
    });
</script>

　　 

api.php

<?php
     //完成業務邏輯 得到數據
     echo $_GET['callback']. '('. json_encode($data). ')';  //$_GET['callback']，就是上面jquery中jsonp請求的 ‘jsonp’參數

?>