同源策略與跨域資源共享

darcrand 發布于2019-08-22 18:08 / 2488人閱讀

摘要：由于瀏覽器的同源策略導致無法直接通過拿到后臺數據。目前，如果非同源，共有三種行為受到限制。此處應有掌聲參考關于跨域資源共享和瀏覽器的同源策略限制的具體講解。

工作中，經常會遇到需要跨域請求數據的情況。由于瀏覽器的同源策略,導致無法直接通過ajax拿到后臺數據。解決這個問題的方式之一就是JSONP。還有一種方式更高效簡單——跨域資源共享(Cross-origin Resource Sharing )，采用這種方式，前端不需要做任何的修改，和平時一樣寫ajax方法，就能夠拿到后臺數據。

同源策略（same-origin policy）—— 瀏覽器安全的基石。 含義：

1995年，同源政策由Netscape 公司引入瀏覽器。目前，所有瀏覽器都實行這個政策。最初的含義是指A網頁cookie，B網頁不能打開，除非這A、B兩個頁面同源。所謂同源指的是三個相同。協議相同，域名相同，端口相同。
舉例來說，現在打開的頁面是http://www.baidu.com網址。同源情況如下：

https://www.baidu.com         // 不同源（協議不同）
http://wenku.baidu.com        // 不同源（域名不同）
http://www.baidu.com:8080     // 不同源（端口不同）
http://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=0       //同源

目的：

保證用戶信息安全，防止網站數據的竊取。

設想這樣一種情況：A網站是一家銀行，用戶登錄以后，又去瀏覽其他網站。如果其他網站可以讀取A網站的 Cookie，會發生什么？

很顯然，如果 Cookie 包含隱私（比如存款總額），這些信息就會泄漏。更可怕的是，Cookie 往往用來保存用戶的登錄狀態，如果用戶沒有退出登錄，其他網站就可以冒充用戶，為所欲為。因為瀏覽器同時還規定，提交表單不受同源政策的限制。

由此可見，"同源政策"是必需的，否則 Cookie 可以共享，互聯網就毫無安全可言了。

限制范圍：

隨著互聯網的發展，"同源政策"越來越嚴格。目前，如果非同源，共有三種行為受到限制。

//（1） Cookie、LocalStorage 和 IndexDB 無法讀取。

//（2） DOM 無法獲得。

//（3） AJAX 請求不能發送。

跨域資源共享（Cross-origin resource sharing）

跨域資源共享（CORS）是一個W3C標準，它允許瀏覽器向跨源服務器發出XMLHttpRequest請求，從而克服了AJAX只能同源使用的限制。

簡介：

CORS需要瀏覽器和服務器同時支持。目前，所有瀏覽器都支持該功能，IE瀏覽器不能低于IE10。

整個CORS通信過程，都是瀏覽器自動完成，不需要用戶參與。對于開發者來說，CORS通信與同源的AJAX通信沒有差別，代碼完全一樣。瀏覽器一旦發現AJAX請求跨源，就會自動添加一些附加的頭信息，有時還會多出一次附加的請求，但用戶不會有感覺。

因此，實現CORS通信的關鍵是服務器。只要服務器實現了CORS接口，就可以跨源通信。

簡單的說，遇到再遇到跨域問題，如果通過CORS來解決的話，前端工作者正常些AJAX就可以了。^_^ （此處應有掌聲！！！）

參考

關于跨域資源共享（CORS）和 瀏覽器的同源策略限制的具體講解。已經有很多大神寫過文章博客。在這里就不再班門弄斧了。有興趣的同學可以根據以下兩個鏈接深入研究下。

跨域資源共享 CORS 詳解

瀏覽器同源政策及其規避方法

云服務器 GPU云服務器同源策略跨域資源共享資源跨域跨域共享

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/95532.html

同源策略與跨域資源共享的糾纏

摘要：扯了這么多，自然不是為了吹水，而是要為了引出前端開發的一個重要的知識點同源策略什么是同源策略出于保護用戶信息安全的目的，現在的瀏覽器都會實施同源策略這個政策，所謂同源策略指的是不同源的客戶端腳本在沒有明確授權情況下，不允許讀寫對方的資源。導語你家的小孩帶了他的朋友來你們的家里玩，你家的小孩如果要在自家屋里拿玩具玩、拿東西吃你自然是不會阻止，但是如果你家小孩的朋友人品不行，亂拿東西吃、...

alighters 2019-08-21 11:17 評論0 收藏0
同源策略與跨域資源共享的糾纏

摘要：扯了這么多，自然不是為了吹水，而是要為了引出前端開發的一個重要的知識點同源策略什么是同源策略出于保護用戶信息安全的目的，現在的瀏覽器都會實施同源策略這個政策，所謂同源策略指的是不同源的客戶端腳本在沒有明確授權情況下，不允許讀寫對方的資源。導語你家的小孩帶了他的朋友來你們的家里玩，你家的小孩如果要在自家屋里拿玩具玩、拿東西吃你自然是不會阻止，但是如果你家小孩的朋友人品不行，亂拿東西吃、...

趙連江 2019-06-27 15:05 評論0 收藏0
web安全一，同源策略與跨域

摘要：可以說同源策略在安全中扮演著及其重要的角色。我把這個領域的東西寫成了一個系列，以后還會繼續完善下去安全一同源策略與跨域安全二攻擊安全三攻擊之所以要將同源策略與跨域寫在一起，是因為存在瀏覽器的同源策略，才會存在跨域問題何為同源策略同源策略是瀏覽器實現的一種安全策略，它限制了不同源之間的文檔和腳本交互的權限。只有同一個源的腳本才會具有操作dom、讀寫cookie、session 、a...

cgspine 2019-08-22 14:56 評論0 收藏0
FE.B-理解瀏覽器的同源策略與跨域方案

摘要：方案瀏覽器設置一級域名。場景完全不同源的網站，需要窗口通信方案父子窗口互相寫互相監聽子窗口寫后跳回同域父窗口讀瀏覽器跨文檔通信場景請求非同源地址方案架設服務器代理參考資料瀏覽器同源政策及其規避方法阮一峰前端常見跨域解決方案全跨域幾種方式同源概念：協議，域名，端口相同。目的：保證用戶信息的安全，防止惡意的網站竊取數據。限制的行為： Cookie、LocalStorage 和 In...

oujie 2019-08-30 15:55 評論0 收藏0
FE.B-理解瀏覽器的同源策略與跨域方案

摘要：方案瀏覽器設置一級域名。場景完全不同源的網站，需要窗口通信方案父子窗口互相寫互相監聽子窗口寫后跳回同域父窗口讀瀏覽器跨文檔通信場景請求非同源地址方案架設服務器代理參考資料瀏覽器同源政策及其規避方法阮一峰前端常見跨域解決方案全跨域幾種方式同源概念：協議，域名，端口相同。目的：保證用戶信息的安全，防止惡意的網站竊取數據。限制的行為： Cookie、LocalStorage 和 In...

ghnor 2019-08-02 13:56 評論0 收藏0