众里寻他千百度，蓦然回首，那人却在灯火阑珊处。

百度的结果千篇一律，真正可行性解决方案万里挑一，接下来就介绍下django实现百分百可复制的登录功能。

效果展示

为支持验证码功能，因此需要安装一些rpm包及python功能包，具体如下：

centos安装组件包

1、安装jpegsrc.v9d.tar.gz，解压后执行如下指令：

./configure --enable-shared
make && make install

python功能包安装

1、安装django-ranged-response-0.2.0.tar.gz，解压后执行如下指令：

python3 setup.py install

2、安装Pillow-8.3.1.tar.gz，解压后执行如下指令：

python3 setup.py install

3、安装six-1.16.0.tar.gz，解压后执行如下指令：

python3 setup.py install

4、安装django-simple-captcha-0.5.14.zip，解压后执行如下指令：

python3 setup.py install

至此，验证码相关依赖组件安装完成，可以愉快的玩耍啦。

py代码

1、settings.py增加配置’captcha’

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'captcha',
]

2、urls.py增加配置：

from django.conf.urls import url 
from django.conf.urls import include
    url(r'^#39;,selectpg.index),
    url(r'^login/',selectpg.login),   
    url(r'^logout/',selectpg.logout),  
    url(r'^captcha/',include('captcha.urls')), 

3、selectpg.py增加配置：

from django.shortcuts import render,redirect
import hashlib
from . import myform
def index(request):
    request.encoding='utf-8'
    response={}
    if not request.session.get('is_login',None) :  # 判断未登录
        return redirect('/login/')
    if request.session.get('user_name',None): #判断已登录后返回用户信息到前端html
        condition={}
        condition['user_name']=request.session.get('user_name')
        user_list=modelcontrol.select(condition,'User_List',models,'id').first()
        response['user_list']= user_list
    return render(request,'index.html',response)
def login(request):
    if request.session.get('is_login', None):  # 判断已登录后跳转到业务页面
        return redirect('/')
    if request.method == "POST":
        login_form = myform.UserForm(request.POST)
        if login_form.is_valid():
            username = login_form.cleaned_data['username']
            password = login_form.cleaned_data['password']
            try:
                user = User_List.objects.get(user_name=username)
                if user.password == hash_code(password):  # 哈希值和数据库内的值进行比对
                    request.session['is_login'] = True  # 往session字典内写入用户状态和数据
                    request.session['user_id'] = user.id
                    request.session['user_name'] = user.user_name
                    return redirect('/')
                else:
                    message = "密码不正确！"
            except:
                message = "用户不存在！"
        return render(request, 'login.html', locals())
    login_form = myform.UserForm()
    return render(request, 'login.html', locals())

def logout(request):
    if not request.session.get('is_login', None):  # 如果本来就未登录，也就没有登出一说
        return redirect("/login/")
    request.session.flush()  # 将session中的所有内容全部清空
    return redirect('/login/')

4、myform.py增加配置

from captcha.fields import CaptchaField, CaptchaTextInput
from django import forms
class UserForm(forms.Form):
    username = forms.CharField(label="账号", max_length=16, widget=forms.TextInput(attrs={'class': 'form-control'}))
    password = forms.CharField(label="密码", max_length=16, widget=forms.PasswordInput(attrs={'class': 'form-control'}))
    captcha = CaptchaField(label='验证码', widget=CaptchaTextInput(attrs={'class': 'form-control'}))

html代码

<form class="form-signin" action="/login/" method="post">
  <div class="text-center mb-4">
  	<img class="mb-4" height="72" src="/assets/img/cec-blue.png" />
  </div>
  {% if message %}
    <div class="form-group">{{message}}
    </div>
  {% endif %}
  {% csrf_token %}
  <div class="form-group">
    {{ login_form.username.label_tag}}
    {{ login_form.username}}
  </div>

  <div class="form-group">
    {{ login_form.password.label_tag}}
    {{ login_form.password}}
  </div>
  <div class="form-group">
    {{ login_form.captcha.label_tag }}
    {{ login_form.captcha }}
  </div>
  <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
</form>

script脚本

主要实现验证码切换功能。

<script src="/assets/js/jquery-2.1.4.min.js"></script>
    <script>
        $(function () {
            $('img.captcha').click(function () {
                var $form = $(this).parents('form');
                var url = location.protocol + "//" + window.location.hostname + ":"
                    + location.port + "/captcha/refresh/";
                // Make the AJAX-call
                $.getJSON(url, {}, function (json) {
                    $form.find('input[name="captcha_0"]').val(json.key);
                    $form.find('img.captcha').attr('src', json.image_url);
                });
                return false;
            });
        });
    </script>

至此大功告成，万事大吉。