前面，笔者写了两篇关于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外链安全
希望能帮助到各位吧！