网站的前端安全攻击与防御

1、前端安全:发生在浏览器、单页面应用、web页面的安全问题,比如跨站脚本攻击xss就是前端安全问题

2、后端安全:发生在后端服务器、应用、服务当中的安全问题,比如:SQL注入漏洞发生在后端

前端安全攻击手段

1、XSS攻击

2、CSRF攻击

3、点击劫持

4、iframe带来的风险

5、不安全的第三方依赖包

XSS攻击

XSS 即(Cross Site Scripting)中文名称为:跨站脚本攻击。

恶意攻击者在web页面中会插入一些恶意的script代码。当目标网站、目标用户浏览器渲染HTML文档的过程中,出现了不被预期的脚本指令并执行时,XSS就发生了,因此达到恶意攻击用户的目的。

xss攻击示意图

根据攻击的来源,XSS 攻击可分为反射型、存储型和 DOM 型三种:

反射型XSS:发出请求时,XSS代码出现在URL中,作为输入提交到服务器端,服务器端解析后响应,XSS代码随响应内容一起传回给浏览器,最后浏览器解析执行XSS代码。这个过程像一次反射,故叫反射型XSS。

反射型XSS示意图

1、用户A给用户B发送一个恶意构造了Web的URL。

2、用户B点击并查看了这个URL。

3、用户B获取到一个具有漏洞的HTML页面并显示在本地浏览器中。

4、漏洞HTML页面执行恶意JavaScript脚本,将用户B信息盗取发送给用户A,或者篡改用户B看到的数据等

反射型XSS防御:

我们可以通过html转义来防范,最好是采用成熟的转义库处理

攻击者盗用了你的身份,以你的名义发送恶意请求,对服务器来说这个请求是完全合法的,但是却完成了攻击者所期望的一个操作,比如以你的名义发送邮件、发消息,盗取你的账号,添加系统管理员,甚至于购买商品、虚拟货币转账等。 如下:其中Web A为存在CSRF漏洞的网站,Web B为攻击者构建的恶意网站,User C为Web A网站的合法用户

存储型XSS:存储型XSS和反射型XSS的差别仅在于,提交的代码会存储在服务器端,下次请求目标页面时不用再提交XSS代码,这样,每一个访问特定网页的用户都会被攻击

存储型XSS示意图

1、用户A在网页上创建了某个账户,并且账户信息中包含XSS代码。

2、用户B访问该网站查看XSS代码账户详情页面。

3、服务端返回账户详情页面,和带XSS账户信息。

4、用户B浏览器执行XSS代码,将用户B信息盗取发送给用户A,或者篡改用户B看到的数据等。

存储型XSS攻击防范:

1. 后端需要对提交的数据进行过滤。

2. 前端也可以做一下处理方式,比如对script标签,将特殊字符替换成HTML编码这些等。

DOM-based型XSS:DOM型XSS是基于DOM文档对象模型的一种漏洞,通过 HTML DOM,通过植入js代码,造成dom的更改,因此造成了XSS-DOM漏洞,所以DOM类型的XSS可能是反射型也可能是储存型

DOM型XSS示意图

1、用户B访问网站url中带有XSS代码参数。

2、浏览器下载该网站JavaScript脚本。

3、JavaScript脚本有个方法获取URL中XSS代码参数,并且用innerHtml渲染在dom中。

4、触发XSS代码,造成XSS攻击,cookie数据失窃。

DOM 型 XSS 攻击,实际上就是网站前端 JavaScript 代码本身不够严谨,把不可信的数据当作代码执行了。

DOM 型 XSS防御:

1、在使用 .innerHTML、.outerHTML、document.write() 时要特别小心,不要把不可信的数据作为 HTML 插到页面上,而应尽量使用 .textContent、.setAttribute() 等。

2、在使用 .innerHTML、.outerHTML、document.write() 时要特别小心,不要把不可信的数据作为 HTML 插到页面上,而应尽量使用 .textContent、.setAttribute() 等。

3、在使用 .innerHTML、.outerHTML、document.write() 时要特别小心,不要把不可信的数据作为 HTML 插到页面上,而应尽量使用 .textContent、.setAttribute() 等。

4、Http Only cookie

5、对产品输入要求格式严谨检查过滤

CSRF攻击

攻击者盗用了你的身份,以你的名义发送恶意请求,对服务器来说这个请求是完全合法的,但是却完成了攻击者所期望的一个操作,比如以你的名义发送邮件、发消息,盗取你的账号,添加系统管理员,甚至于购买商品、虚拟货币转账等。 如下:其中Web A为存在CSRF漏洞的网站,Web B为攻击者构建的恶意网站,User C为Web A网站的合法用户

CSRF攻击示意图 CSRF攻击防御:

1、验证 HTTP Referer 字段

2、使用 token验证

3、显示验证方式:添加验证码、密码等

4、涉及到数据修改操作严格使用 post 请求而不是 get 请求

点击劫持攻击:

点击劫持是一种视觉上的欺骗手段。攻击者使用一个透明的、不可见的iframe,覆盖在一个网页上,然后诱使用户在网页上进行操作,此时用户将在不知情的情况下点击透明的iframe页面。通过调整iframe页面的位置,可以诱使用户恰好点击在iframe页面的一些功能性按钮上。

点击劫持示意图

一个简单的点击劫持例子,就是当你点击了一个不明链接之后,自动关注了某一个人的博客或者订阅了视频

点击劫持防御

1、X-Frame-Options浏览器机制:X-Frame-Options HTTP响应头是用来给浏览器指示允许一个页面能否在<frame>、<iframe>、<object>中展现的标记,有三个可选的值:DENY:浏览器会拒绝当前页面加载任何frame页面(即使是相同域名的页面也不允许)SAMEORIGIN:允许加载frame页面,但是frame页面的地址只能为同源域名下的页面ALLOW-FROM:可以加载指定来源的frame页面(可以定义frame页面的地址)但这个缺陷就是chrome、Safari是不支持ALLOW-FROM语法!

2、使用认证码认证用户:点击劫持漏洞通过伪造网站界面进行攻击,网站开发人员可以通过认证码识别用户,确定是用户发出的点击命令才执行相应操作。识别用户的方法中最有效的方法是认证码认证。例如,在网站上广泛存在的发帖认证码,要求用户输入图形中的字符,输入某些图形的特征等

3、 使用 FrameBusting 代码“:使用 JavaScript 脚本阻止恶意网站载入网页。如果检测到网页被非法网页载入,就执行自动跳转功能。如果用户浏览器禁用JavaScript脚本,那么FrameBusting代码也无法正常运行。所以,该类代码只能提供部分保障功能

iframe 带来的风险

有些时候我们的前端页面需要用到第三方提供的页面组件,通常会以iframe的方式引入。典型的例子是使用iframe在页面上添加第三方提供的广告、天气预报、社交分享插件等等

iframe本身不受我们控制,那么如果iframe中的域名因为过期而被恶意攻击者抢注,或者第三方被黑客攻破,iframe中的内容被替换掉了,从而利用用户浏览器中的安全漏洞下载安装木马、恶意勒索软件等等,这问题可就大了

iframe防御:

iframe有了一个叫做sandbox的安全属性,通过它可以对iframe的行为进行各种限制,在 iframe 元素中添加上这个关键词就行,另外,sandbox也提供了丰富的配置参数,我们可以进行较为细粒度的控制。一些典型的参数如下:

allow-forms:允许iframe中提交form表单 

allow-popups:允许iframe中弹出新的窗口或者标签页(例如,window.open(),showModalDialog(),target=”_blank”等等)

allow-scripts:允许iframe中执行JavaScript

allow-same-origin:允许iframe中的网页开启同源策略

如果你只是添加上这个属性而保持属性值为空,那么浏览器将会对 iframe 实施史上最严厉的调控限制

不安全的第三方依赖

项目里面使用了很多第三方的依赖,不论应用自己的代码的安全性有多高,如果这些来自第三方的代码有安全漏洞,那么对应用整体的安全性依然会造成严峻的挑战。jQuery就存在多个已知安全漏洞,Node.js也有一些已知的安全漏洞

第三方依赖包防御:

手动检查这些第三方代码有没有安全问题是个苦差事,主要是因为应用依赖的这些组件数量众多,手工检查太耗时,有自动化的工具可以使用,比如NSP(Node Security Platform),Snyk、sonarQubej检测工具等等

vue对前端安全的处理:Vue 的安全措施

当然还存在很多别的攻击手段,比如:

Https 也可能存在的风险(强制让HTTPS降级回HTTP,从而继续进行中间人攻击)

本地存储数据泄露(尽可能不在前端存储任何敏感、机密的数据)

cdn劫持(攻击者劫持了CDN,或者对CDN中的资源进行了污染)

版权申明:本站文章均来自网络,如有侵权,请联系01056159998 邮箱:itboby@foxmail.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

中国领先的互联网域名及云服务提供商

为您提供域名,比特币,P2P,大数据,云计算,虚拟主机,域名交易最新资讯报道

域名注册云服务器