跨域原因
瀏覽器的同源策略 ： 域名不同，協(xié)議不同，端口不同，是無法訪問的
不同源地址之間如果需要相互請求，必須服務(wù)端和客戶端配合使用
跨域的原理
jsonp 通過script 標簽請求一個服務(wù)器 php文件
這個文件返回的結(jié)果是一段js，作用是調(diào)用我們事先定義好的函數(shù)
========================封裝jsonp原理========================
封裝jsonp原理：
客戶端：

      function jsonp (url, params, callback) {
              var funcName = 'jsonp_' + Date.now() + Math.random().toString().substr(2, 5)
              if (typeof params === 'object') {
                var tempArr = []
                for (var key in params) {
                  var value = params[key]
                  tempArr.push(key + '=' + value)
                }
                params = tempArr.join('&')
              }

              var script = document.createElement('script')
              script.src = url + '?' + params + '&callback=' + funcName
              document.body.appendChild(script)

              window[funcName] = function (data) {
                callback(data)

                delete window[funcName]
                document.body.removeChild(script)
              }
            }

方法調(diào)用：

jsonp('http://localhost/jsonp/server.php', { id: 123 }, function (res) {
              console.log(res)
        })

PHP控制器端：

if (empty($_GET['callback'])) {
          header('Content-Type: application/json');
          echo json_encode($data);
          exit();
  }
        // 如果客戶端采用的是 script 標記對我發(fā)送的請求
        // 一定要返回一段 JavaScript
        header('Content-Type: application/javascript');
        $result = json_encode($data);
                    $callback_name =$_GET['callback'];
                    echo "typeof {$callback_name} === 'function' && {$callback_name}({$result})";

==========================Jquery跨域請求使用=====================
Jquery跨域請求使用 CORS

$.ajax({          
        url:'http://localhost/jsonp/server.php'                                                                          
        dataType:'jsonp', 
        success:function(res){
            console.log(res);
        }
    })

PHP控制器端需要加請求頭聲明

    header('Access-Control-Allow-Origin:*')  # *通配符  可以指定域名跨域
    header('Cenntent-Type:application/javascript') #設(shè)置返回的數(shù)據(jù)

==========================js發(fā)送post請求跳轉(zhuǎn)頁面=====================
因為get方式提交數(shù)據(jù)都會顯示在URL中，一個是安全問題，另外一個是URL長度限制，URL長度約為2083。所以數(shù)據(jù)量過多時會導(dǎo)致數(shù)據(jù)丟失。

/*
       *功能： JS跳轉(zhuǎn)頁面，并已POST方式提交數(shù)據(jù)
       *參數(shù)： URL 跳轉(zhuǎn)地址 PARAMTERS 參數(shù)
       *返回值： 
       */

       function ShowReport_Click() {
           var parames = new Array();
           //添加參數(shù)
           parames.push({ name: "param1", value: "param1"});
           parames.push({ name: "param2", value: "param2"});
           Post("www.baidu.com", parames);
           return false;
       }

       /*
       *功能： 模擬form表單的提交
       *參數(shù)： URL 跳轉(zhuǎn)地址 PARAMTERS 參數(shù)
       *返回值：
       */
       function Post(URL, PARAMTERS) {
           //創(chuàng)建form表單
           var temp_form = document.createElement("form");
           temp_form.action = URL;
           //如需打開新窗口，form的target屬性要設(shè)置為'_blank'
           temp_form.target = "_self";
           temp_form.method = "post";
           temp_form.style.display = "none";
           //添加參數(shù)
           for (var item in PARAMTERS) {
               var opt = document.createElement("textarea");
               opt.name = PARAMTERS[item].name;
               opt.value = PARAMTERS[item].value;
               temp_form.appendChild(opt);
           }
           document.body.appendChild(temp_form);
           //提交數(shù)據(jù)
           temp_form.submit();
       }