[BT]小迪安全2023学习笔记（第16天：PHP开发-Js/Ajax）

第16天

名词解释

AJAX（Asynchronous JavaScript and XML）是一种在客户端实现与服务器异步通信的技术。它允许网页在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页内容。AJAX 的使用可以大大提升用户体验和网页性能。以下是 AJAX 的一些主要用途和优点：

用途

• 动态内容加载：通过 AJAX，可以动态地从服务器加载新内容并展示在页面上，无需重新加载整个页面。

• 表单提交：使用 AJAX 提交表单数据，并根据服务器响应在页面上显示结果，例如注册表单、评论发布等。

• 实时更新：在网页上显示实时数据，如股票信息、新闻更新、社交媒体动态等

• 用户界面交互：提高用户界面响应性，例如通过在用户输入时提供自动完成建议。

• 数据检索和发送：从服务器检索数据（如 JSON、XML），并根据这些数据在客户端进行处理或显示。

js文件上传验证

有两种验证上传文件的方式，一个是PHP后端代码验证，属于黑盒测试，一个是JS前端代码验证，属于白盒测试。

代码展示：

<script>
        function validateFile() {
            var fileInput = document.getElementById('fileInput');
            var filePath = fileInput.value;
            var allowedExtensions = /(\.jpg|\.jpeg|\.png|\.gif)$/i;

            if (!allowedExtensions.exec(filePath)) {
                alert('请上传图片文件（.jpg, .jpeg, .png, .gif）。');
                fileInput.value = '';
                return false;
            } else {
                // 如果需要，可以进一步读取文件并显示图片预览
                alert('上传成功');
                return true;
            }
        }
    </script>

网页效果

漏洞分析

通过浏览器的开发者工具我们可以很方便的看到网站验证的js代码，进而可以根据代码逻辑进行绕过，甚至可以屏蔽浏览器的js代码执行功能，直接绕过（也可以利用BP抓包，先将上传文件修改成网站要求的后缀名，上传后抓包再次修改成原文件后缀，这样既绕过了浏览器的验证，还将正确文件后缀发送给了网站）。

Ajax登录验证

代码展示：

Ajax_login.php部分：

<script>
        function checkLogin() {
            var username = document.getElementById('username').value;
            var password = document.getElementById('password').value;

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'ajax.php', true);
            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    if (xhr.responseText == 'success') {
                        alert('登录成功！');
                    } else {
                        alert('登录失败：用户名或密码错误。');
                    }
                }
            };
            xhr.send('username=' + encodeURIComponent(username) + '&password=' + encodeURIComponent(password));
        }
    </script>

ajax.php部分：

<?php
// 这里仅为示例，实际应用中应连接数据库验证用户名和密码

$username = $_POST['username'];
$password = $_POST['password'];

// 示例用户信息，实际应用中应从数据库获取
$correct_username = 'admin';
$correct_password = '111';

if ($username == $correct_username && $password == $correct_password) {
    echo 'success';
} else {
    echo 'fail';
}
?>

网页效果

漏洞分析

本质上Ajax就是由js代码实现的，因此我们也能看到Ajax的实现过程，在这个例子中，由Ajax实现登录验证，由于在提交表单数据后AJax会向服务器发送数据并接收返回值（也就是状态码），服务器通过Ajax.php进行验证，验证成功返回success，Ajax接收到success的状态码就会执行登陆成功的代码。因此我们就可以通过禁用js代码或者篡改代码达到判断为真的效果，但如果登陆成功后的js代码只是显示登陆成功而没有实质性的界面返回，那么即便绕过了也没什么用，因为登录后还是由php后端进行操作，我们是看不到的。

判断网页是否采用了Ajax的步骤为：1.查看网页源码，如果出现ajax字样或者相关函数，一般都是ajax实现的；2。如果源码中有包含文件那么就需要点进去查看包含文件的内容，因为有些网页可能通过包含文件的方式将实现ajax的代码放在另一个文件中，直观上看不到的。

Ajax购物

如果网页采用Ajax传送购物数据，后台根据数据计算返回结果，那么有以下几种1形式：

1.商品价格以前端设置价格为准，数据接收价格后运算
原理： 即Ajax会将网页前端显示的商品价格和用户输入表单的数量打包发送给服务器进行判断，服务器根据这两个值计算后验证用户余额是否足够，足够则显示购买成功。但是一方面我们可以抓包修改Ajax发送给服务器的商品价格的值，比如将1000的商品价格修改成1，数量大大增加，依旧会返回购买成功，另一方面我们可以只修改服务器返回的状态码，将其修改为购买成功的状态码，因而也可以显示购买成功。

2.商品价格以数据库对应价格为准，数据接收价格后运算
原理： 和上一个一样，只不过这里会多取数据库的数据（但没有作运算，而是用来返回显示价格或其它操作），本质上还是利用Ajax返回的价格运算后进行判断的，因此利用过程和上一个类似（数据库取出来的价格数据基本没发挥用处）。

3.商品价格以数据库对应价格为准，数据只接受数量后运算
原理： 虽然在价格上没有问题了，但我们可以设置数量为小数或者负数（如果网站不做限制的话），因此此处也有问题。

4.商品价格以数据库对应价格为准，数据只接受数量后做过滤运算
原理： 这一步网站就限制的比较死了，只接受数量并且还对数量进行限制，只允许正确合法的值。但是依然可以修改返回的状态码达到购买成功的效果。