對於軟件開發者來說，理解同源策略，可以很好地解決了一個痛點， 不同域名下的資源讀寫 !
古代的楚河漢界明確地規定了雙方的活動界限，如果沒有這些界限，天下必將大亂。同樣，在我們的瀏覽器，也有着一些界限和策略，才讓 Web 世界之所以能如此美好地呈現在我們面前，這些安全策略有效地保障了用戶計算機的本地安全與Web安全。
同源策略
瀏覽器有一個很重要的概念——同源策略(Same-Origin Policy)。所謂同源是指，域名，協議，端口相同。不同源的客戶端腳(javascript、ActionScript)本在沒明確授權的情況下，不能讀寫對方的資源。
同源策略，它是由 Netscape 提出的一個著名的安全策略，現在所有支持JavaScript 的瀏覽器都會使用這個策略。
實際上，這種策略只是一個規範，並不是強制要求，各大廠商的瀏覽器只是針對同源策略的一種實現。它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會受到影響。可以說Web是構建在同源策略基礎之的。
如果Web世界沒有同源策略，當你登錄Gmail郵箱並打開另一個站點時，這個站點上的JavaScript就可以跨域讀取你的Gmail郵箱數據，這樣整個Web世界就無隱私可言了。
cookie 劫持 瀏覽器中的 cookie就變得非常不安全，a 域名下的網頁，就可以讀取你瀏覽器中的所有 cookie，如果攻擊者能獲取到用戶登陸憑證的Cookie，甚至可以繞開登陸流程，直接設置這個cookie的值，來訪問用戶的賬號。
舉例說明
-
不同源舉例
-
同源舉例
http://www.bigertech.com/a、http://www.bigertech.com/b,這兩個url 只是在同一個域名下面的不同目錄，自然是符合同源策略的
安全防禦
客戶端的攻擊主要來自javascript的腳本，一般體現在對未授權的資源進行讀寫操作。
Web上的資源有很多，有的只有讀權限，有的同時擁有讀和寫的權限。比如：HTTP請求頭裏的Referer（表示請求來源）只可讀，同源和不同源就是根據這個Referer值進行判斷的， 而document.cookie則具備讀寫權限。這樣的區分也是爲了安全上的考慮。
跨域請求
比如：在 a 頁面使用 AJAX 發送一個請求，請求的地址是另外一個站點，
注：
AJAX是Asynchronous JavaScript And XML的縮寫，讓數據在後臺進行異步傳輸，常見的使用場景有：對網頁的局部數據進行更新時，不需要刷新整個網頁，以節省帶寬資源。AJAX也是黑客進行Web客戶端攻擊常用的技術，因爲這樣攻擊就可以悄無聲息地在瀏覽器後臺進行，做到“殺人無形”。
點擊查看響應數據：手機歸屬地 API
如果使用 ajax 發送請求，像下面這樣
$.ajax('http://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=15850781443');響應數據，oop 報錯了
XMLHttpRequest cannot load http://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=15850781443.
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://www.baidu.com' is therefore not allowed access.因爲不同源，瀏覽器把這個操作給攔截了，然後返回一個錯誤給用戶。
解決辦法
目標站點，假如是http://tcc.taobao.com明確返回HTTP響應頭：
Access-Control-Allow-Origin: http://www.evil.com或者設置爲 *， 允許所有網站進行同源訪問，但是這樣也太不安全了。
用 jsonp 來解決跨域問題
JSONP(JSON with Padding)是一個非官方的協議，它允許在服務器端集成Script tags返回至客戶端，通過javascript callback的形式實現跨域訪問（這僅僅是JSONP簡單的實現形式）。
舉個例子
客戶端
在客戶端調用提供JSONP支持的URL Service，獲取JSONP格式數據。
比如客戶想訪問http://www.yiwuku.com/myService?jsonp=onCustomerLoaded
假設客戶期望返回JSON數據：["customername1","customername2"]
那麼真正返回到客戶端的 數數據：
callbackFunction([“customername1","customername2"])<script type="text/javascript">
function onCustomerLoaded(result, methodName){
conssole.log(result);// 輸出結果 ["customername1","customername2"]
}
</script>
<script type="text/javascript" src="http://www.yiwuku.com/myService?jsonp=onCustomerLoaded"></script>服務器端：
String callback = request.getParameter("callback");
out.println(callback + "('" + data+ "')");或者使用 jquery 的ajax 解決方案
$.ajax({
url: 'http://localhost:8080/test2/searchJSONResult.action',
type: "GET",
dataType: 'jsonp',
data: {name:”ZhangHuihua”}, timeout: 5000,
success: function (json) {
//客戶端jquery預先定義好的callback函數,成功獲取跨域服務器上的json數據後,會動態執行這個callback函數
alert(json);
},
error: function (){
alert("請求失敗！");
}
});HTML中的script標籤可以加載並執行其他域的JavaScript，於是我們可以通過script標記來動態加載其他域的資源。JSONP易於實現，但是也會存在一些安全隱患，如果第三方的腳本隨意地執行，那麼它就可以篡改頁面內容，截獲敏感數據。但是在受信任的雙方傳遞數據，JSONP是非常合適的選擇。
jsonp 帶來的問題
JSONP爲解決跨站問題帶來便利的同時，也存在一定的潛在風險，下面以實例說明其風險。比如jsonpTest.htm提供jsonp格式的調用，返回如下面格式的callBack({"json":"jsonTest"})的數據。
-
腳本注入
未對回調的函數名以及輸入內容進行過兩次。比如用戶輸入如下面請求:xxx.com/jsonpTest.htm?jsonp=alert('OK');
則若服務器不過濾，響應內容爲alert("OK");{"json":"jsonTest"}
如果 jsonp 請求爲：xxx.com/jsonpTest.htm?jsonp=<img onclick=”xxx”/>則若服務器不過濾，響應內容爲:
<img onclick=”xxx”/>;{xx}
用戶點擊圖片，也會有xss攻擊。 -
惡意攻擊
對輸入的內容進行安全轉義過濾，卻未限定jsonp回調的合法的字符，下面參數經過安全轉義後仍然不變。while(true){alert(document.cookie)} 攻擊者就可以使用此參數對用戶進行惡搞。 - 解決辦法
- 對輸出的內容進行必要的安全轉義
- 限定jsonp的回調方法名的安全字符範圍爲(a-zA-Z0-9$ )
- 設置響應類型是非json或javascript類型，比如text/html。防止攻擊者直接輸入jsonp請求的url，瀏覽器端收到數據時以js的方式運行響應的內容。
跨域的更多解決辦法
- 如果是log之類的簡單單項通信，新建
<img>,<script>,<link>,<iframe>元素，通過src，href屬性設置爲目標url。實現跨域請求 - 現代瀏覽器中多窗口通信使用HTML5規範的
targetWindow.postMessage(data, origin);，其中data是需要發送的對象，origin是目標窗口的origin。window.addEventListener('message', handler, false);handler的event.data是postMessage發送來的數據，event.origin是發送窗口的origin，event.source是發送消息的窗口引用 - 內部服務器代理請求跨域url，然後返回數據
- 跨域請求數據，現代瀏覽器可使用HTML5規範的CORS功能，只要目標服務器返回HTTP頭部Access-Control-Allow-Origin: 即可像普通ajax一樣訪問跨域資源