jsonp跨域


首先我們來說說什么是跨域

      跨域是指從一個域名的網頁去請求另一個域名的資源。比如從www.baidu.com 頁面去請求 www.google.com 的資源。但是一般情況下不能這么做,它是由瀏覽器的同源策略造成的

   這里我們又會有一個問題 啥叫同源策略啊,那我們再來說說同源策略,

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

   那現在又有一個問題,為什么瀏覽器要有同源策略呢,我打個比方           。。。。。。。。。。嘀      嘀嘀 准備發車了

           舉個大栗子:你和你對象是一家 ,隔壁是老王一家,你每天可以回家和你對象做一些有趣的事情(你們懂得),要是老王也可以回你家和你對象做一些有趣的事情,那你能同意嗎?肯定不能啊,對吧(要是你就喜歡做一道綠光,那在下佩服),整個栗子里,你家就相當於一個域名,而你和你對象就相當於域名里面的資源,而老王家也相當於一個域名,老王和老王對象相當於老王家這個域名下的資源,正常情況下是肯定不能互相訪問的,這就是同源策略所做的事情,讓不同域名間不能亂訪問互相的資源, 但是我們能不能繞過同源策略訪問到呢,當然可以啊,要是不可以的話,偷情這個詞豈不是失去了意義,那現在我們來講一種跨域的方法:jsonp

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

           原理:利用了src不受同源策略的影響 ,可以訪問其他頁面的數據

          大家需要注意一點:jsonp並不能解決所有的跨域問題,因為使用jsonp跨域需要被提供jsonp接口

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

                           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()}

 

 

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

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM