2019獨角獸企業重金招聘Python工程師標準>>>

JSONP和AJAX相同，都是客戶端向服務器端發送請求：1、給服務器端傳遞內容2、從服務器端獲取數據 的方式

AJAX屬于同源策略

JSONP屬于非同源策略(跨域請求) -> 實現跨域請求的方式有很多種，只不過JSONP是最常用的

區分同源和非同源：

當前頁面的地址 ? && ?數據請求的接口地址

? ? 1）協議 ?2）域名或者IP 3）端口號

? ? 以上三部分完全相同屬于同源策略，就是用AJAX技術請求數據，如果有一個不同就屬于非同源策略，一般使用JSONP技術請求數據

JSONP的原理：JSONP請求一定需要對方的服務器做支持才可以

在script的世界中，沒有同源跨域這一說，只要你給我src屬性中的地址是一個合法的地址，script都可以把對應的內容請求回來，JSONP就是利用了script的這個原理
? ? 1、首先把需要請求數據的那個跨域的API數據接口的地址賦值給script的src屬性中

? ? 2、把當前頁面中的某一個函數名當做參數值傳遞給需要跨域請求數據的服務器(url問好傳參:callback=fn)

? ? 3、服務器接收到請求后，需要進行特殊的處理，把你傳遞進來的函數名和它需要給你數據拼接成一個字符串， 例如：我們傳遞進去的函數名是fn，它準備好的數據是"fn([{'name':'xxx'}])"

? ? 4、最后服務器把準備的數據通過HTTP協議返回給我們客戶端，客戶端發現其實就是讓我們的fn執行，而且還給fn傳遞了一堆的數據，那些數據就是我們想要的

jquery的ajax和JSONP的調用

? ? ajax：

? ? $.ajax({

????? ? url:"",

????? ? type:"",

????? ? dataType:"json",

????? ? data:null,

????? ? async:true,

????? ? timeout： 1000， ?//設置超時時間，一般都設置3000ms

????????cache:false, //設定get請求的時候不走緩存數據,原理就是在url后面加一個緩存數，默認值是true

????? ? success:function(data){},

????? ? error:function(data){}

????})

jsonp:都是GET和異步請求的，不存在其他的請求方式和同步請求，而且jquery會默認會給JSONP的請求清除緩存

$.ajax({

????? ? url:"",

????? ? dataType:"jsonp",

????? ? timeout： 1000， ?//設置超時時間，一般都設置3000ms

? ? ? ?jsonpCallback:"fn" //自定義傳遞給服務器的函數名，而不是jquery自動生成的

????? ? jsonp:"cb" ?//吧傳遞函數名的那個形參callback變為cb

????})

????

?

?

?

轉載于:https://my.oschina.net/u/3419199/blog/1528274

總結

以上是生活随笔為你收集整理的区分同源与非同源的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。