前端XSS攻击

一：那么什么是XSS攻击呢？

人们经常将跨站脚本攻击（Cross Site Scripting）缩写为CSS，但这会与层叠样式表（Cascading Style Sheets，CSS）的缩写混淆。因此，有人将跨站脚本攻击缩写为XSS。恶意攻击者往Web页面里插入恶意html代码，当用户浏览该页之时，嵌入其中Web里面的html代码会被执行，从而达到恶意用户的特殊目的。主要指的自己构造XSS跨站漏洞网页或者寻找非目标机以外的有跨站漏洞的网页。XSS是web安全最为常见的攻击方式，在近年来，常居web安全漏洞榜首。

光看这个定义，很多同学一定不理解是什么意思，下面我会模拟XSS攻击，同学们应该就知道怎么回事了。 在模拟XSS攻击之前，我们先来看看XSS攻击的分类。

二：XSS攻击有几种类型呢？

①反射型XSS攻击（非持久性XSS攻击）

②存储型XSS攻击（持久型XSS攻击）

③DOM-based型XSS攻击

三：接下来我们将模拟这几种XSS攻击

第一种：反射型XSS攻击（非持久性XSS攻击）

反射型XSS攻击一般是攻击者通过特定手法，诱使用户去访问一个包含恶意代码的URL，当受害者点击这些专门设计的链接的时候，恶意代码会直接在受害者主机上的浏览器执行。此类XSS攻击通常出现在网站的搜索栏、用户登录口等地方，常用来窃取客户端Cookies或进行钓鱼欺骗。

下面我们来看一个例子：

这是一个普通的点击事件，当用户点击之后，就执行了js脚本，弹窗了警告。

你会说，这能代表啥，那如果这段脚本是这样的呢？

当浏览器执行这段脚本，就盗用了用户的cookie信息，发送到了自己指定的服务器。你想想他接下来会干什么呢？

第二种：存储型XSS攻击（持久型XSS攻击）

攻击者事先将恶意代码上传或者储存到漏洞服务器中，只要受害者浏览包含此恶意代码的页面就会执行恶意代码。这意味着只要访问了这个页面的访客，都有可能会执行这段恶意脚本，因此存储型XSS攻击的危害会更大。此类攻击一般出现在网站留言、评论、博客日志等交互处，恶意脚本存储到客户端或者服务端的数据库中。

增删改查在web管理系统中中很常见，我们找到一个新增功能页面，这以一个富文本输入框为例，输入以下语句，点击保存，再去查看详情，你觉得会发生什么？

没错，如果是前端的同学或许已经猜到了，h是浏览器的标签，这样传给服务器，服务器再返回给前端，浏览器渲染的时候，会把第二行当成h1标签来渲染，就会出现以下效果，第二行文字被加粗加大了。

这里我只是输入了普通的文本，而近几年随着互联网的发展，出现了很多h5多媒体标签，那要是我利用它们呢？ 不清楚的同学，可自行打开W3cschool网站查看：

黑客是怎么攻击我们的呢？黑客会自己写一些脚本，来获取我们的cookies敏感等信息，然后他发送到他自己的服务器，当他拿到我们这些信息后，就能绕过前端，直接调后端的接口，比如提现接口，想想是不是很恐怖！！！

这里我利用一个在线远程网站来模拟XSS攻击。地址如下： svg.digi.ninja/xss.svg 目前网站还能访问，同学们可以自己体验一下，如果后期链接失效不可访问了，同学们可以重新找一个，或者自己手写一个脚本，然后伪装成svg上传到自己的服务器。 我们在地址栏输入上面这个地址，来看看实际效果，提示你已经触发了XSS攻击。

当我们点击确定，出现了一个黑人，哈哈哈，恭喜你，你银行卡里的钱已经全被黑客取走了。这就是黑客得逞后的样子，他得逞后还在嘲讽你。

接下来，我们利用多媒体标签和这个脚本来攻击我们实际的的网站。

这里记得在地址前面加上//表示跨越，如图：

当我们点击保存之后，再去查看详情页面发现。

哦豁，刚刚那个网站的场景在我们的web管理系统里面触发了，点击确定，那个小黑人又来嘲讽你了。

这脚本在我们的管理系统成功运行，并获取了我们的敏感信息，就可以直接绕过前端，去直接掉我们后端银行卡提现接口了。并且这类脚本由于保存在服务器中，并存着一些公共区域，网站留言、评论、博客日志等交互处，因此存储型XSS攻击的危害会更大。

第三种：DOM-based型XSS攻击

客户端的脚本程序可以动态地检查和修改页面内容，而不依赖于服务器端的数据。例如客户端如从URL中提取数据并在本地执行，如果用户在客户端输入的数据包含了恶意的JavaScript脚本，而这些脚本没有经过适当的过滤或者消毒，那么应用程序就可能受到DOM-based型XSS攻击。

下面我们来看一个例子

这段代码的意思是点击提交之后，将输入框中的内容渲染到页面。效果如下面两张图。

①在输入框中输入内容

②点击确定，输入框中的内容渲染到页面

那如何我们输内容是不是普通文本，而是恶意的脚本呢？

没错，恶意的脚本在渲染到页面的时候，没有被当成普通的文本，而是被当成脚本执行了。

总结：XSS就是利用浏览器不能识别是普通的文本还是恶意代码，那么我们要做的就是阻止恶意代码执行，比如前端的提交和渲染，后端接口的请求和返回都要对此类特殊标签做转义和过滤处理，防止他执行脚本，泄露敏感的数据。感兴趣的同学可以根据我上面的步骤，自己去模拟一个XSS攻击，让自己也体验一次当黑客的感觉。

这篇好文章是转载于：学新通技术网