jsonp跨域

首先咱們來講說什麼是跨域json

      跨域是指從一個域名的網頁去請求另外一個域名的資源。好比從www.baidu.com 頁面去請求 www.google.com 的資源。可是通常狀況下不能這麼作,它是由瀏覽器的同源策略形成的跨域

   這裏咱們又會有一個問題 啥叫同源策略啊,那咱們再來講說同源策略,瀏覽器

   首先什麼叫同源呢 字面理解就是相同的起源,同源指的就是域名,協議,端口均相同app

   那如今又有一個問題,爲何瀏覽器要有同源策略呢,我打個比方           。。。。。。。。。。嘀      嘀嘀 準備發車了函數

           舉個大栗子:你和你對象是一家 ,隔壁是老王一家,你天天能夠回家和你對象作一些有趣的事情(大家懂得),要是老王也能夠回你家和你對象作一些有趣的事情,那你能贊成嗎?確定不能啊,對吧(要是你就喜歡作一道綠光,那在下佩服),整個栗子裏,你家就至關於一個域名,而你和你對象就至關於域名裏面的資源,而老王家也至關於一個域名,老王和老王對象至關於老王家這個域名下的資源,正常狀況下是確定不能互相訪問的,這就是同源策略所作的事情,讓不一樣域名間不能亂訪問互相的資源, 可是咱們能不能繞過同源策略訪問到呢,固然能夠啊,要是不能夠的話,偷情這個詞豈不是失去了意義,那如今咱們來說一種跨域的方法:jsonpjsonp

           jsonp是一種非正式的傳輸協議(注意他和json 輕量級的數據交換格式半毛錢關係都沒有)ui

           原理:利用了src不受同源策略的影響 ,能夠訪問其餘頁面的數據this

          你們須要注意一點:jsonp並不能解決全部的跨域問題,由於使用jsonp跨域須要被提供jsonp接口google

           步驟:1.建立一個全局函數url

                           function  huidiao(data){

                               console.log(data)}

                     2.動態建立一個script標籤

                            var script1 = document.createElement("script")

                     3.給標籤的src賦值  (即接口的url)

                            script1.src = "http:www.baidu.com?a=1&b=2&cb=huidiao"

                     4.將屬性爲callback值爲全局函數名的鍵值對寫到url的後面

                          注意 huitiao即爲全局函數的名稱   兩者名字只要相對應就能夠

                          大部分jonsp接口都爲callback,百度的jsonp接口爲cb

                     5.將標籤插入到頁面上

                           document.body.appendChild(script1);

                     6.將標籤加載完後刪除

                          script1.onload = function(){

                          this.remove()}

 

 

---------------------------------------------------------------------------上---------面-----------見----解----如-------有----------錯-------誤----,----請----各----位----大--------佬-----指-------正---------------------------------------------------------------------------

相關文章
相關標籤/搜索