跨域問題

1、何爲跨域

     只要協議/域名/端口有一個不一樣,他們之間須要的通訊的話,就是跨域!!

     端口：服務器有不少端口，每個端口對應一個服務（項目）

     1> 協議: 指的就是Http請求協議, http:// 和 https://  s:加密安全，數字證書

     2> 域名: 好比說: www.baidu.com 和 www.sxt.com

     3> 端口: web服務器 Apache, 會有不少端口!! 80 和 8080 兩個端口

      瀏覽器不能執行其餘網站的腳本，它是由瀏覽器的同源策略形成的，

      是瀏覽器對JavaScript施加的安全限制。

 

2、跨域解決方案:

     資源共享(跨域資源共享Cross-Origin Resource Sharing)和JSONP

     1 資源共享:

         1） 加請求頭 header("Access-Control-Allow-Origin: *");

         2） 服務器代理 echo file_get_contents('http://127.0.0.1:8080/02.php');

          讓本身的服務器去訪問外部服務器，服務器之間沒有界限

 

引導：

     <script src='03-01.js'><script>

等於 <script>

          function show(){

               alert('我是show方法');

     </script>

     <script>

 

     <script src="http://127.0.0.1:8080/03-02.js"></script>

等於<script>

          show();

     <script>

 

json:一種數據格式，jsonp:目的拿數據      寫程序：試錯

3、jsonp的實現原理：

     經過src能夠突破跨域的這個特徵（也是一個漏洞），訪問到了另一臺服務器

     同時另一臺服務器把數據返回過來！從而實現了跨域的請求

     也就是說拿到另一條服務器的數據！！

 

4、jsonp請求： 必須有回調函數（做用：獲取另一臺服務器的數據，至關於一個橋樑），屬於get請求

     1.設置回調函數

     2.建立一個新的script標籤

     3.設置請求地址，爲了解決get緩存加了一個事件毫秒數

     4.append到頁面中，至關於ajax中的send()

     function show(data){}

     var script=document.createElement('script')

     script.src='http://127.0.0.1:8080/jsonp.php?call=show&__'+new Date().getTime();

     document.body.appendChild(script)

 

5、ajax和jsonp的區別：

     1.ajax經過XMLHttpRequest對象發送異步請求獲取數據局，jsonp利用script的src屬性獲取數據

     2.Ajax能夠有get請求和post請求，可是jsonp只有get請求

     3.jsonp

 

 

6、圖片ping跨域:

     1.兩個回調函數：onload和onerror,可是獲取不到裏面的內容

     2.必須請求的是一個圖片纔會執行onload,不然執行onerror

     限制：1）必須請求一個圖片路徑 2）即便請求成功，圖片是二進制，用不了

     用處：廣告追蹤

     var img = new Image()

     img.src=;

     img.onload = function(){ cl(success）}

     img.onerror= function(){ cl(fail) }

 

二級聯動

     監聽下拉框的值發生變化: 用onchange: 監聽表單元素值發生變化!!

     取下拉框的值: 元素.value

     <select id="city" onchange="sendJSONP();">

     if(v == 0){//若是值爲0,就不發送請求

            //重置下拉框

            document.getElementById('area').innerHTML = '<option>--請選擇--</option>';

            return;

     }

     script.src = '08.php?callback=show&__='+new Date().getTime()+'&k='+v;

 

本人在用JSON.parse把字符串轉化爲json對象時，一直報錯VM356:1 Uncaught SyntaxError: Unexpected token i in JSON at position 1，很費解，var str1 = "{‘name’:’cxh’,’sex’:’ man’}";一直認爲這個字符串沒有任何問題，最終發現，使用parse這個方法，要求很嚴格，必須是var str1 = ‘{ "name":"cxh","sex":" man" }’;就是json的k和value必須都用雙引號包起來；

 

謹記json格式問題k和value都加雙引號，單引號也不能夠

var str1 = ‘{ "name":"cxh","sex":" man" }’;
console.log(JSON.parse(str1));

console.log(JSON.parse(str1)["name"]);