1. 程式人生 > >利用原生js實現ajax跨域請求資料

利用原生js實現ajax跨域請求資料

首先,頁面中不需要引入任何的檔案。

1、前臺html頁面

<script>
    //定義一個ajax
    var $ = {
      ajax:function(option){
        var url = option.url;
        var callback = option.callback;
        var dataType = option.dataType;
        //判斷資料型別是不是jsonp格式,如果是的話,就動態建立一對script標籤。
        if(dataType == "jsonp"){
          var script = document.createElement("script");
          script.src=url+"?callback="+callback;
          document.body.appendChild(script);
        }
      }
    };
    //呼叫ajax
    $.ajax({
      type:"get",
      url:"http://demo.com/demo1.php",
      callback:"test",
      dataType:"jsonp"
    });
  </script>
  <script>
    function test(data){
      console.log(data);
    }
  </script>

 2、後臺頁面

<?php
    $callback = $_GET["callback"];
    //讀取demo2.json檔案中的資料
    $data = file_get_contents("demo2.json");
    // 返回的資料最終只能是字串
    echo $callback.'('.$data.')';
?>