记一次原生JS实现XSS攻击案例

时间 2021-02-22

标签 javascript php html vue java ajax thinkphp 数据库后端跨域栏目 JavaScript 繁體版

原文原文链接

XSS：跨站脚本（Cross-site scripting）

攻击手段和目的:
攻击者使被攻击者在浏览器中执行脚本后，若是须要收集来自被攻击者的数据（如cookie或其余敏感信息），能够自行架设一个网站，让被攻击者经过JavaScript等方式把收集好的数据做为参数提交，随后以数据库等形式记录在攻击者本身的服务器上。

为了加深本身对XSS攻击的理解，特地尝试了一下，并把整个过程记录下来。javascript

攻击过程：
①、客户端收集用户数据（如留言、发布文章功能）
②、攻击者将留言内容写入了可执行的JavaScript代码
③、将上面的数据未经处理直接存入数据库
④、其余用户查看该网站，看了上面包含了可执行的JavaScript代码的文章和评论
⑤、其余用户就会在浏览器客户端执行攻击者注入的JavaScript代码php

本次试验用到以下技术：
①、（客户端）原生Ajax请求
②、（服务端）thinkphp，为了试验方便，不使用数据库，直接返回数据
③、 Cors跨域html

原生Ajax请求

<!DOCTYPE html>
<html lang="en">
<head> 
    <meta charset="UTF-8">
    <title>XSS测试</title> 
</head> 
<body> 
    <div id="Text"></div> 
    <input type="button" value="XSS测试"  onclick="ajax();"/> 
    
    <script type="text/javascript"> 
        function ajax() { 
            //先声明一个异步请求对象 
            let xmlHttpReg = null; 
            if (window.ActiveXObject) { //若是是IE 
                xmlHttpReg = new ActiveXObject("Microsoft.XMLHTTP"); 
            } else if (window.XMLHttpRequest) { 
                xmlHttpReg = new XMLHttpRequest(); //实例化一个xmlHttpReg 
            } 
            
            //若是实例化成功,就调用open()方法,就开始准备向服务器发送请求 
            if (xmlHttpReg !== null) { 
                xmlHttpReg.open("get", "http://vueapp.com", true);
                xmlHttpReg.send(null); 
                xmlHttpReg.onreadystatechange = doResult; //设置回调函数 
            } 
        
            //设定函数doResult() 
            function doResult() { 
                if (xmlHttpReg.readyState == 4) {//4表明执行完成 
                    if (xmlHttpReg.status == 200) {//200表明执行成功 
                        document.getElementById("Text").innerHTML = xmlHttpReg.responseText;   
                    } 
                } 
             }
        } 
    </script> 
</body>
</html>

在这里我使用的是get请求
其中请求地址http://vueapp.com 是我自定义的地址，使用Apache配置vue

因为这里涉及到跨域问题（出于浏览器安全的同源策略，协议、域名、端口号任一不一样都属于跨域）java

Failed to load http://vueapp.com/: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.ajax

个人解决方法是CORS
在后端的接口中添加这么一行代码thinkphp

header('Access-Control-Allow-Origin:*');  // 容许全部访问源

返回的数据是：数据库

$this->ajaxReturn(array('status' => 0,'info' => "<img src='11.png' onerror='alert(11)'/>"));

这里咱们利用img标签的onerrer属性来执行JS代码，因此src属性填一个访问不了就能够触发onerrer了后端

开始测试

点击 XSS测试按钮,结果如图（谷歌浏览器）：
跨域

这就是一个最最最简单的XSS攻击案例

此次咱们去一个网站盗用cookie

能够看到全部的cookie信息都在这里了

*发现的问题

为何我不直接用script标签，而用img的onerror属性。由于script标签有问题，在后台返回来的script标签在dom是存在的，可是并无执行还请各位大佬多多指正