前面，筆者寫了兩篇關於web安全的文章，裏面對兩種安全策略進行分析的同時還簡介了其餘的安全策略：
Web安全：細說前端XSS攻擊與防範
Web安全：細說後端密碼安全防範
最近筆者又碰上了兩個新的web安全策略：同源策略 和 window.opener安全問題 —— 這兩個不算是新問題，但是也不是經常用到的。
同源策略
同源： 如果兩個URL的協議、域名和端口都相同，我們就稱這兩個URL爲同源。
關於同源問題，經常能碰上一些【意想不到】的“驚喜”：
- 同源策略限制了來自不同源的JavaScript腳本對當前DOM對象的讀和寫的操作
- 同源策略限制了不同源站點讀取當前站點的Cookie、IndexDB、LocalStorage等（本地）數據
- 同源策略限制了通過XMLHttpRequest等方式將站點的數據發送給不同源的站點
當然，也引出了各種解決同源策略的方法：
| 方法 | 解讀/說明 |
|---|---|
| 跨文檔消息傳輸 | 通過postMessage消息隊列機制和JavaScript接口和不同源的DOM進行通信（前端常用的幾種跨域通信方式實踐：jsonp&cors&postMessage） |
| 跨域資源共享（CORS） | 跨域資源在服務端設置允許跨域，就可以進行跨域訪問控制，從而使得跨域數據得以安全傳輸 |
| 內容安全策略（CSP） | 主要以白名單方式配置可信任內容來源，可在前端配置（meta標籤>http-equiv&content屬性）；在網頁中，能夠使白名單中的內容正常執行（包含JS、CSS、Image等），而非白名單的內容無法執行（這也是XSS的解決方案之一） |
window.opener安全問題
window.opener表示打開當前窗體頁面的父窗體是誰。
比如：在A頁面中，我們通過一個帶有target="_blank" 的a標籤打開了一個新的頁面B。那麼在B頁面裏，window.opener的值爲A頁面的window對象！
一般來說，打開同源的頁面的話，不會有什麼問題。但是對於跨域的外部鏈接來說，則存在被釣魚的風險：比如你正在瀏覽XX網站，不小心點了某個按鈕從而從當前頁面打開了一個外部鏈接；那麼在被打開的外部頁面可用通過window.opener.location改寫來源站點的地址。
利用這一點，將來源站點改寫到釣魚站點頁面上，例如跳轉到僞造的高仿XX頁面，當你再回到原先的頁面（表面上看是從這個新打開的頁面“返回”原頁面）時，你並沒有發覺原先的“這個”頁面已經被改動了 ——而這時候你的賬號已經被弄走了。
這裏筆者給大家拿筆者的博客頁面簡單展示一下其危害（下圖第一張爲展示opener，第二張爲更改父href）：
當然，任何安全漏洞都有其預防策略：
- 設置rel屬性：
<a href="xxx" rel="noopener noreferrer">某外鏈</a>rel=noopener設置了禁止新頁面傳遞源頁面的地址 —— 通過此屬性打開的頁面，其window.opener值爲null - 既然也和同源有關，那就將外鏈替換爲內部的跳轉連接服務：跳轉時先跳到內部地址，再由服務器redirect到外鏈
- 通過JS的
window.open()打開外鏈
本文介紹的兩個安全策略第一個就不說了，在好多安全策略中貌似都有其身影；至於第二個…
它和“CSRF攻擊”、“點擊劫持攻擊”似乎都很相似，其區別在於功能上：
CSRF攻擊處理的是第三方網站盜用cookie從而在原網站“自動”發送評論；
點擊劫持攻擊處理的是hidden-iframe隱藏危險按鈕誘使用戶點擊；
而本文所說window.opener則是處理的target外鏈安全
希望能幫助到各位吧！