web安全
https://websec.readthedocs.io/zh/latest/ (opens new window)
# 如何防范 iframe 被钓鱼网站嵌套导致的安全问题
面试官提示,iframe 如何判断是否被嵌套?(想到可以通过 top 变量值是否等于 window 来判断)
if (top.location != location) {
top.location.href = location.href;
}
可以有多种方式绕开,不建议这样做
比如下面的方法就可以绕过
document.write(
'<iframe seamless sandbox security="restricted" id="url_mainframe" frameborder="0" scrolling="yes" name="main" src="http://192.168.57.1:8023/" style="height:100%; visibility: inherit; width: 100%; z-index: 1;overflow: visible;"></iframe>'
);
虽然网页无法获取非同域名下的内嵌网页的 DOM 相关信息,但是假如用户习惯了在某个非官方的登入入口进入,当该非官方的页面某天更改代码,假设前几次进入的是一个伪造的界面(钓鱼网站),之后登陆出错后再切成 iframe,用户信息就会被盗取,所以有这个风险,参考 baidu、youku、youtube 都有做这个处理;
Refused to display 'https://youku.com/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.
https://blog.csdn.net/weixin_33769125/article/details/91434181 (opens new window)
mdn https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CSP (opens new window)
阮一峰的 csp http://www.ruanyifeng.com/blog/2016/09/csp.html (opens new window)
https://juejin.cn/post/6844903843658989576 (opens new window)
禁止网站被 iframe 嵌套的几种方式 https://juejin.cn/post/6998541496945213477 (opens new window)
# 正确的做法就是后端添加响应头 X-Frame-Options
X-Frame-Options 有三个值
建议后端通过添加响应头的方法实现
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/X-Frame-Options (opens new window)
deny
表示该页面不允许在 frame 中展示,即便是在相同域名的页面中嵌套也不允许。
sameorigin
表示该页面可以在相同域名页面的 frame 中展示。
allow-from uri
表示该页面可以在指定来源的 frame 中展示。