django之简单验证码实现与form表单钩子函数补充

本篇主要讲解简单的验证码实现，验证码使用基本都是找现成的组件来实现，用代码实现这个简单功能主要是了解了解验证码内部的实现。

 

本篇导航：

• 五位验证码图示 
• 代码实现
• 登录验证
• Form组件钩子函数补充

 

一、五位验证码图示

---

 

二、代码实现

1、首先用bootstrap布一个上图简单的页面

<div class="container">
    <div class="row">
        <div class="col-md-5 col-md-offset-3">
            <h1>账户登录</h1><span class="error"></span>
            <form>
                {% csrf_token %}
                <div class="form-group">
                    <label for="username">用户名</label>
                    <input type="text" class="form-control" id="username" placeholder="username">
                </div>
                <div class="form-group">
                    <label for="password">密码</label>
                    <input type="password" class="form-control" id="password" placeholder="password">
                </div>

                <div class="row validCode">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label for="validCode">验证码</label>
                            <input type="text" class="form-control validCode_text" id="validCode"
                                   placeholder="validCode">
                        </div>
                    </div>

                    <div class="col-md-6">
                        <img class="validCode_img" src="/get_validCode_img/" alt="" width="200px" height="50px">
                    </div>
                </div>
                <input type="button" value="登录" class="btn btn-primary" id="subBtn">
            </form>
        </div>
    </div>
</div>

View Code