浏览器页面安全

#积累/浏览器原理

包括页面安全、系统安全和网络安全。下面三种安全风险都属于页面安全。

CSRF 攻击

跨站点请求伪造，黑客利用了用户的登录态信息，通过第三方站点对服务器做请求。

  • 例子：
    用户在已经登录gmail的状态下，点击了陌生链接，陌生站点利用gmail的登录态信息，发出请求并给原用户账号设置了自动转发，从而获取到gmail用户的所有邮件内容。
  • 三个条件：
    目标站点存在CSRF漏洞；
    用户登录过目标站点，并保持有登录态信息；
    诱导用户打开了第三方站点。
  • 防护，主要是要区别对待第三方站点发起的请求：

1.CSRF Token。服务器返回的页面包括CSRF Token，每次请求都带上CSRF Token；第三方站点因为没有token，服务器能够拒绝请求，防止CSRF攻击。
2.利用请求头的Origin，验证第三方站点。
3.cookie设置SameSite属性。

跨站脚本攻击XSS

页面被注入恶意JavaScript代码，它可以窃取用户cookie、利用交互事件监听用户行为、嵌入弹窗广告等。

  • 例子：
    H5项目由http协议访问，在手机上容易被插入iframe广告，它就是利用DNS劫持等手段注入了恶意JavaScript代码，修改了DOM结构。
  • 防护：
    服务器对输入的内容做特殊字符过滤，前端也要做；
    使用HttpsOnly属性，即使被注入恶意代码，JavaScript也不能读取到指定cookie。

同源策略

同源指的是协议、域名和端口一致。两个相同的源之间是可以相互访问资源和操纵DOM的。

  • 例子：
    打开百度百科的域名劫持词条，再点击打开域名解析词条，第二个页面可以通过window.opener访问到第一个页面的DOM结构、cookie，并允许做操作。

  • 为了安全，不同源之间有多方面的安全限制：
    不同源之间无法相互访问和操作DOM，引出了XSS攻击；
    不同源之间无法访问Cookie、IndexDB、LocalStorage 等数据；
    不同源之间限制了通过XMLHttpRequest发送给不同源的站点。

  • 不同源，即使存在风险也允许做：
    页面中可以嵌入第三方资源；
    不同源之间通过跨域资源共享（CORS），有条件地允许XMLHttpRequest请求不同源的站点；
    不同源之间通过跨文档消息机制（window.postMessage），实现不同源间的消息通信。