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