古代的楚河漢界明確規定了楚漢兩軍的活動界限，理應遵守，否則必天下大亂，而事實上天下曾大亂后又統一。這里我們不用管這些“分久必合，合久必分”的問題，關鍵是看到這里規定的“界限”。Web世界之所以能如此美好地呈現在我們面前，多虧了瀏覽器的功勞，不過瀏覽器不是一個花瓶——只負責呈現，它還制定了一些安全策略，這些安全策略有效地保障了用戶計算機的本地安全與Web安全。

 注：

計算機的本地與Web是不同的層面，Web世界（通常稱為Internet域）運行在瀏覽器上，而被限制了直接進行本地數據（通常稱為本地域）的讀寫。

同源策略是眾多安全策略的一個，是Web層面上的策略，非常重要，如果少了同源策略，就等于楚漢兩軍沒了楚河漢界，這樣天下就大亂了。

同源策略規定：不同域的客戶端腳本在沒明確授權的情況下，不能讀寫對方的資源。

下面分析同源策略下的這個規定，其中有幾個關鍵詞：不同域、客戶端腳本、授權、讀寫、資源。

1．不同域或同域

同域要求兩個站點同協議、同域名、同端口，比如：表 1-1 展示了表中所列站點與http://www.foo.com是否同域的情況。

表1-1  是否同域情況

從表1-1中的對比情況可以看出，我們通常所說的兩個站點同域就是指它們同源。

2．客戶端腳本

客戶端腳本主要指JavaScript（各個瀏覽器原生態支持的腳本語言）、ActionScript（Flash的腳本語言），以及JavaScript與ActionScript都遵循的ECMAScript腳本標準。Flash提供通信接口，使得這兩個腳本語言可以很方便地互相通信。客戶端的***幾乎都是基于這兩個腳本語言進行的，當然JavaScript是最廣泛的。

被打入“冷宮”的客戶端腳本有VBScript，由于該腳本語言相對較孤立，又有當紅的JavaScript存在，所以實在是沒有繼續存在的必要。

3．授權

一般情況下，看到這個詞，我們往往會想到服務端對客戶端訪問的授權。客戶端也存在授權現象，比如：HTML5新標準中提到關于AJAX跨域訪問的情況，默認情況下是不允許跨域訪問的，只有目標站點（假如是http://www.foo.com）明確返回HTTP響應頭：

Access-Control-Allow-Origin: http://www.evil.com

那么www.evil.com站點上的客戶端腳本就有權通過AJAX技術對www.foo.com上的數據進行讀寫操作。這方面的***細節很有趣，相關內容在后面會詳細介紹。

 注：

AJAX是Asynchronous JavaScript And XML的縮寫，讓數據在后臺進行異步傳輸，常見的使用場景有：對網頁的局部數據進行更新時，不需要刷新整個網頁，以節省帶寬資源。AJAX也是***進行Web客戶端***常用的技術，因為這樣***就可以悄無聲息地在瀏覽器后臺進行，做到“殺人無形”。

4．讀寫權限

Web上的資源有很多，有的只有讀權限，有的同時擁有讀和寫的權限。比如：HTTP請求頭里的Referer（表示請求來源）只可讀，而document.cookie則具備讀寫權限。這樣的區分也是為了安全上的考慮。

5．資源

資源是一個很廣泛的概念，只要是數據，都可以認為是資源。同源策略里的資源是指Web客戶端的資源。一般來說，資源包括：HTTP消息頭、整個DOM樹、瀏覽器存儲（如：Cookies、Flash Cookies、localStorage等）。客戶端安全威脅都是圍繞這些資源進行的。

 注：

DOM全稱為Document Object Model，即文檔對象模型，就是瀏覽器將HTML/XML這樣的文檔抽象成一個樹形結構，樹上的每個節點都代表HTML/XML中的標簽、標簽屬性或標簽內容等。這樣抽象出來就大大方便了JavaScript進行讀/寫操作。Web客戶端的***幾乎都離不開DOM操作。

到此，已經將同源策略的規定分析清楚，如果Web世界沒有同源策略，當你登錄Gmail郵箱并打開另一個站點時，這個站點上的JavaScript就可以跨域讀取你的Gmail郵箱數據，這樣整個Web世界就無隱私可言了。這就是同源策略的重要性，它限制了這些行為。當然，在同一個域內，客戶端腳本可以任意讀寫同源內的資源，前提是這個資源本身是可讀可寫的。

本文節選自《web前端***技術揭秘》

鐘晨鳴，徐少培編著

電子工業出版社出版