web前端安全基础与攻防(续篇)

浏览数：42 / 时间：2015年06月09日

web前端安全基础与攻防(续篇)

继续前面的内容，由于转发到一些论坛时，限制了每个帖子中，添加图片链接的数量，而前篇包含的图片数量已经达到上限，因此开一个新帖继续讨论。

还记得在前篇中有一段针对使用 IE 浏览器用户的攻击载荷，如下所示：

<script>function XSS(){
        a = new ActiveXObject(‘Microsoft.XMLHTTP‘);
        a.open(‘get‘, ‘http://www.baidu.com‘, false);
        a.send();
        b = a.responseText;
        document.write(b);
        }
        XSS();
</script>

上面代码中，使用 IE 实现的XHR（XMLHttpRequest）对象访问百度首页并且通过javascript读取返回的数据（responseText），并且可以写入当前页面。

这是因为 IE 的同源策略没有很好地对XMLHttpRequest进行约束，例如，上述代码可能位于本地硬盘的一个HTML文本中（C:\Users\shayi\Desktop\XssPayloadTest.html）

我们已经在上一篇博文中看到，IE 默认允许XHR跨域加载并读写资源；对于其它浏览器（FireFox 与 chrome）而言，本地文件系统路径与“百度首页”是不同源的，因此它们会限制当前HTML文本所在源中的javascript读写从百度首页返回的数据，换言之，这两个浏览器的同源策略默认仅允许XHR加载，读写相同源中的数据，除非对浏览器以及目标站点的web服务器配置为启用HTML5规范中引入的“跨域资源共享”（CORS）。

下面的示例代码，通过使用非 IE 浏览器支持的XHR对象，尝试跨域加载资源并写入至当前页面DOM中的一个节点：

（引用自《白帽子讲web安全一书》，略作修改）

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-type" content="text/html;charset=utf-8" />
        <title>XssPayloadTest</title>
        <script type = "text/javascript">
        var xmlhttp;
        function LoadXMLDoc(url)
        {
            xmlhttp = null;
            if (window.XMLHttpRequest)
            {
                xmlhttp = new XMLHttpRequest();
            }
            else if (window.ActiveXObject)
            {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            if (xmlhttp != null)
            {
                xmlhttp.onreadystatechange = state_Change();
                xmlhttp.open("GET", url, true);
                xmlhttp.send(null);
                
            }
            else
            {
                alert("your browser does not support XMLHTTP");
            }
        }

        function state_Change()
        {
            if (xmlhttp.readyState == 4)
            {
                if (xmlhttp.status == 200)
                {
                    document.getElementById(‘T1‘).innerHTML = xmlhttp.responseText;
                }
                else
                {
                    alert("problem retrieving data:" + xmlhttp.statusText);
                }
    
            }
        }        
        </script>
    
    </head>
    <body onload = "LoadXMLDoc(‘http://bbs.pediy.com/index.php‘)">
    <div id = "T1" style = "border:1px solid black;height:40;width:300;padding:5"></div><br />
    <button onclick = "LoadXMLDoc(‘http://shayi1983.blog.51cto.com‘)">Click</button>
    </body>
</html>

这个在HTML文档头部（head元素内）引入的javascript定义了两个函数： LoadXMLDoc()通过浏览器支持的XHR类型来跨域发起HTTP GET请求并加载资源；

state_Change()检查对方web服务器返回的HTTP响应状态码，然后决定是读取响应数据的内容并写入当前页面（状态码为200）；还是给出服务器端返回的错误信息（除200以外的其它状态码）。

在HTML文档体（body元素内），通过实际调用LoadXMLDoc()来对看雪论坛首页发起跨域请求（注意，当前“源”是本地文件系统上的测试用HTML页面），然后尝试将对方返回的“响应文本”（responseText）写入当前页面DOM的T1节点的内部HTML文本中，并且在文档体中添加一个按钮，用户点击时将再次通过XHR对象，发起对我的51cto博客页面的跨域请求。

上面代码在FireFox中的测试结果如下所示：