JSONP跨域和CORS跨域


什么是跨域?

跨域:指的是瀏覽器不能執行其它網站的腳本,它是由瀏覽器的同源策略造成的,是瀏覽器的安全限制!

同源策略

同源策略:域名、協議、端口均相同。

瀏覽器執行JavaScript腳本時,會檢查這個腳本屬於那個頁面,如果不是同源頁面,就不會被執行。

JSONP跨域

只支持GET請求,不支持POST等其它請求,也不支持復雜請求,只支持簡單請求。

CORS跨域

支持所有的請求,包含GET、POST、OPTOIN、PUT、DELETE等。既支持復雜請求,也支持簡單請求。

JSONP和CORS跨域理解

使用目的: JSONP與CORS的使用目的相同,並且都需要服務端和客戶端同時支持,但CORS的功能更加強大。
JSONP(json with padding 填充式json):利用了使用src引用靜態資源時不受跨域限制的機制。主要在客戶端搞一個回調做一些參數接收與操作的處理,並把這個回調函數告知服務器,而服務器端需要做的是按照JavaScript的語法把數據放到約定好的回調函數之中即可,jQuery很早之前就已經把JSONP語法糖化了,使用起來會更加方便。
CORS(Cross-origin resource sharing 跨域資源共享):依附於AJAX,通過添加HTTP Header部分字段請求與獲取有權限訪問的資源。CORS對開發者是透明的,因為瀏覽器會自動根據請求的情況(簡單和復雜)做出不同的處理。CORS的關鍵是服務器端的配置支持,由於CORS是W3C中一項較“新”的方案,以至於各大網頁解析引擎還沒有對齊進行嚴格規格的實現,所以不同引擎下可能會有一些不一致。

JSONP和CORS的優缺點

1. JSONP的主要優勢在於對瀏覽器的支持較好;雖然目前主流瀏覽器都支持CORS,但IE9及以下不支持CORS。

2. JSONP只能用於獲取資源(即只讀,類似於GET請求);CORS支持所有類型的HTTP請求,功能完善。(這點JSONP被玩虐,但大部分情況下GET已經能滿足需求了)
JSONP的錯誤處理機制並不完善,我們沒辦法進行錯誤處理;而CORS可以通過onerror事件監聽錯誤,並且瀏覽器控制台會看到報錯信息,利於排查。

3. JSONP只會發一次請求;而對於復雜請求,CORS會發兩次請求。

4. 始終覺得安全性這個東西是相對的,沒有絕對的安全,也做不到絕對的安全。畢竟JSONP並不是跨域規范,它存在很明顯的安全問題:callback參數注入和資源訪問授權設置。CORS好歹也算是個跨域規范,在資源訪問授權方面進行了限制(Access-Control-Allow-Origin),而且標准瀏覽器都做了安全限制,比如拒絕手動設置origin字段,相對來說是安全了一點。但是回過頭來看一下,就算是不安全的JSONP,我們依然可以在服務端端進行一些權限的限制,服務端和客戶端也都依然可以做一些注入的安全處理,哪怕被攻克,它也只能讀一些東西。就算是比較安全的CORS,同樣可以在服務端設置出現漏洞或者不在瀏覽器的跨域限制環境下進行攻擊,而且它不僅可以讀,還可以寫。

應用場景

如果需要兼容IE低版本瀏覽器,無疑,JSONP。
如果需要對服務端資源進行操作,無疑,CORS。
其他情況的話,根據自己的對需求的分析來決定和使用。


免責聲明!

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



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