pikachu靶场第三关-密码爆破之验证码绕过(on client)（附代码审计）

标签：code checkCode pikachu random 验证码 client 第三关 var Math

源代码如下：

if(isset($_POST['submit'])){
    if($_POST['username'] && $_POST['password']) {
        $username = $_POST['username'];
        $password = $_POST['password'];
        $sql = "select * from users where username=? and password=md5(?)";
        $line_pre = $link->prepare($sql);


        $line_pre->bind_param('ss', $username, $password);

        if ($line_pre->execute()) {
            $line_pre->store_result();
            if ($line_pre->num_rows > 0) {
                $html .= '<p> login success</p>';

            } else {
                $html .= '<p> username or password is not exists～</p>';
            }

        } else {
            $html .= '<p>执行错误:' . $line_pre->errno . '错误信息:' . $line_pre->error . '</p>';
        }


    }else{
        $html .= '<p> please input username and password～</p>';
    }


}

这源代码和第一关的一模一样，这里就不解释了。

详见：pikachu靶场第一关-密码爆破之基于表单的暴力破解（附代码审计）-CSDN博客

那么这一关的验证码从何而来？又有什么意义呢？

验证码的作用：
验证码是防机器的，防止恶意破解密码、刷票、论坛灌水、刷页。有效的防止某个黑客以特定程序暴力破解的方式进行不断的登录尝试。
一种常用的CAPTCHA测试是让用户输入一个扭曲变形的图片上所显示的文字或数字，扭曲变形是为了避免被光学字符识别（OCR, Optical Character Recognition）之类的电脑程序自动辨识出图片上的文数字而失去效果。由于这个测试是由计算机来考人类，而不是标准图灵测试中那样由人类来考计算机，人们有时称CAPTCHA是一种反向图灵测试。

前端验证码：前端验证码是由前端浏览器生成的验证码，填完验证码后，先检查验证码正确与否，如果正确则向后端发送请求，调用后端接口。但是验证码放在前端，安全性不高。

第三关的密码爆破就是前端验证码，所以在后端的源码中并没有出现任何与验证码有关的代码。

我们来看一下前端的代码。

<script language="javascript" type="text/javascript">
    var code; //在全局 定义验证码
    function createCode() {
        code = "";
        var codeLength = 5;//验证码的长度
        var checkCode = document.getElementById("checkCode");
        var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//所有候选组成验证码的字符，当然也可以用中文的

        for (var i = 0; i < codeLength; i++) {
            var charIndex = Math.floor(Math.random() * 36);
            code += selectChar[charIndex];
        }
        //alert(code);
        if (checkCode) {
            checkCode.className = "code";
            checkCode.value = code;
        }
    }

    function validate() {
        var inputCode = document.querySelector('#bf_client .vcode').value;
        if (inputCode.length <= 0) {
            alert("请输入验证码！");
            return false;
        } else if (inputCode != code) {
            alert("验证码输入错误！");
            createCode();//刷新验证码
            return false;
        }
        else {
            return true;
        }
    }


    createCode();
</script>

与之前使用的php语言不同，前端的代码涉及javascript语言，是作为开发web页面的一种脚本语言。

<script></script> 标签用于定义客户端脚本，比如：上面的是这段代码，写在html 内部发挥作用，也可以通过 src 属性插入外部脚本文件(xxx.js)

language="javascript" type="text/javascript"，表示插入<script> </script>；其内部的代码为Javascript语句。

 var code; //在全局 定义验证码

全局变量的作用：“在这，叫code的只有我！”

function createCode()

新建了个叫createCode的函数，代码如下：

        code = "";
        var codeLength = 5;//验证码的长度
        var checkCode = document.getElementById("checkCode");
        var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//所有候选组成验证码的字符，当然也可以用中文的
 
        for (var i = 0; i < codeLength; i++) {
            var charIndex = Math.floor(Math.random() * 36);
            code += selectChar[charIndex];
        }
        //alert(code);
        if (checkCode) {
            checkCode.className = "code";
            checkCode.value = code;
        }

code = "";

将code变量赋值为“”，即空。

 var codeLength = 5;//验证码的长度

定义验证码长度为5、

var checkCode = document.getElementById("checkCode");

.document.getElementById()是javascript中访问某个元素的方法。

括号中的checkCode是用来标识元素的。

下面是相关代码，其作用是将输入的验证码文本附加上id为checkCode的元素属性。

 <label><input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 100px" /></label><br />

即定义checkCode变量，并将输入的验证码赋值给它

var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z');//所有候选组成验证码的字符，当然也可以用中文的

定义了一个数组，其中有0, 1, 2, 3, 4, 5, 6, 7, 8, 9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'

code：我饿了，现在要吃五个人，就从0到Z你们几个里面挑了！

 for (var i = 0; i < codeLength; i++) {
            var charIndex = Math.floor(Math.random() * 36);
            code += selectChar[charIndex];
        }

var i = 0

定义变量i，并赋值为0，执行一次for语句

i < codeLength; i++

判断i是否小于5，之后i+1，此时i=1，再执行一次for语句

 var charIndex = Math.floor(Math.random() * 36);

Math.floor( Math.random() )生成随机整数生成随机字符

Math.random()：获取0~1随机数

Math.floor() ：其实返回值就是该数的整数位

如：现在要从1~52内取一个随机数：
首先Math.random()*52 //这样我们就能得到一个 >=0 且 <52的数
然后加1：Math.random()*52 + 1 //现在这个数就 >=1 且 <53 再使用Math.floor取整
最终: Math.floor(Math.random()*52 + 1) 这就能得到一个取值范围为1~52的随机整数

Math.(random/round/cell/floor)随机数的用法：
Math.random() 返回值是一个大于等于0，且小于1的随机数
Math.random()*N 返回值是一个大于等于0，且小于N的随机数
Math.round() 四舍五入的取整
Math.ceil() 向上取整，如Math.cell(0.3)=1 ，又如Math.ceil(Math.random()*10) 返回1~10
Math.floor() 向下取整，如Math.floor(0.3)=0、又如Math.floor(Math.random()*10)返回0~9
引申：
Math.round(Math.random()*15)+5; 返回5~20随机数
Math.round(Math.random()*(y-x))+x; 返回x~y的随机数，包换负数

获取1~36的随机整数，赋值给变量charIndex

code += selectChar[charIndex];

从数组selectChar中获取对应的字符串，并令其与code相加。

例如：charIndex=1，selectChar=“0”，code=“”+“0”=“0”。

当i=5时，for语句循环条件不成立，for语句结束，执行后续代码。

code：吃饱了！

if (checkCode) {
            checkCode.className = "code";
            checkCode.value = code;
        }

if(a)和if(a!=0)等价。if(!a)和if(a==0)等价。

如果checkCode存在，则

checkCode.className = "code";

为验证码区域添加样式名；

checkCode.value = code;

将生成验证码赋值到显示区；

createCode函数定义完成，继续执行后续代码，定义validate函数：

function validate() {
        var inputCode = document.querySelector('#bf_client .vcode').value;
        if (inputCode.length <= 0) {
            alert("请输入验证码！");
            return false;
        } else if (inputCode != code) {
            alert("验证码输入错误！");
            createCode();//刷新验证码
            return false;
        }
        else {
            return true;
        }

var inputCode = document.querySelector('#bf_client .vcode').value;

获取#bf_client .vcode，即输入的验证码的值，并将其赋值给inputCode

<form id="bf_client" method="post" action="bf_client.php" onsubmit="return validate();">
<!--            <fieldset>-->
                <label>
                    <span>
                        <input type="text" name="username" placeholder="Username" />
                        <i class="ace-icon fa fa-user"></i>
                    </span>
                </label>
                </br>

                <label>
                    <span>
                        <input type="password" name="password" placeholder="Password" />
                        <i class="ace-icon fa fa-lock"></i>
                    </span>
                </label>
                </br>


                <label>
                        <span>
                            <input class="vcode" name="vcode" placeholder="验证码" type="text" />
                            <i class="ace-icon fa fa-lock"></i>
                        </span>
                </label>

                </br>

                <label><input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 100px" /></label><br />

                <label><input class="submit"  name="submit" type="submit" value="Login" /></label>

        </form>

 if (inputCode.length <= 0) {
            alert("请输入验证码！");
            return false;
        } else if (inputCode != code) {
            alert("验证码输入错误！");
            createCode();//刷新验证码
            return false;
        }
        else {
            return true;
        }

return true；返回正确的处理结果。
return false；返回错误的处理结果；终止处理；阻止提交表单；阻止执行默认的行为。
return；把控制权返回给页面。

 createCode();

调用createCode();函数，创建新的验证码；

标签：code,checkCode,pikachu,random,验证码,client,第三关,var,Math
From： https://blog.csdn.net/yzasts/article/details/136770641

pikachu靶场第三关-密码爆破之验证码绕过(on client)（附代码审计）

相关文章

赞助商

阅读排行