使用django编辑用户登录页

*小猫钓鱼*

已于 2024-04-12 18:50:42 修改

阅读量600

点赞数 8

文章标签： django 数据库 sqlite

于 2024-04-12 18:32:10 首次发布

本文链接：https://blog.csdn.net/weixin_44905216/article/details/137690869

版权

django编辑用户登录页

配置路由url

#导入视图函数
from apps.views import account
urlpatterns = [
    path('login/', account.login),
    path('logout/', account.logout),
    path('image/code/', account.image_code),
]

编辑试图函数，导入模块

check_code函数地址
md5加密
#在app下创建views目录，并在目录下创建account.py文件
#以下在account.py中编辑

from io import BytesIO
from django.shortcuts import render, redirect, HttpResponse
from django import forms
from django.forms import ValidationError

from apps import models
#自定义MD5加密函数
from apps.utils.encryption import md5_hash 
#自定义生成随机验证码函数
from apps.utils.random_code import check_code

编辑登录视图函数

定义form类用于生成input框

class LoginForm(forms.Form):
    name = forms.CharField(label="username", max_length=32
                           , widget=forms.TextInput,
                           required=True
                           )
    password = forms.CharField(label="password",
                               required=True,
                               widget=forms.PasswordInput(render_value=True),
                               )
    code = forms.CharField(label="code",
                           required=True,
                           widget=forms.TextInput,
                           )

    def clean_password(self):
        pwd = self.cleaned_data.get("password")
        return md5_hash(pwd)

    def __init__(self, *args, **kwargs):
        super().__init__(*args, **kwargs)
        for name, field in self.fields.items():
            if field.widget.attrs:
                field.widget.attrs["class"] = "form-control"
                field.widget.attrs["placeholder"] = field.label
            else:
                field.widget.attrs = {"class": 'form-control', 'placeholder': field.label}

定义登录视图函数

def login(request):
    if request.method == 'GET':
        form = LoginForm()
        return render(request, 'login.html', {"form": form})

    form = LoginForm(data=request.POST)
    if form.is_valid():
        code = form.cleaned_data.pop('code')
        code_string = request.session.get('code_string')
        if code.upper() != code_string:
            form.add_error("code", "验证码错误")
            return render(request, 'login.html', {"form": form})
        request.session.set_expiry(60 * 60 * 24 * 7) #session超时时间
        exits_object = models.Admin.objects.filter(**form.cleaned_data).first()
        if exits_object:
            request.session['info'] = {'id': exits_object.id, 'name': exits_object.name}
            return redirect('/admin/list/')
        else:
            form.add_error("password", ValidationError("用户名或密码错误"))
            return render(request, 'login.html', {"form": form})
    return render(request, 'login.html', {"form": form})

定义登出视图函数

def logout(request):
    request.session.clear()
    return redirect('/login/')

定义生产随机验证码函数

#调用check_code函数，生成随机验证码图片及内容

def image_code(request):
    img, code_string = check_code()
    request.session["code_string"] = code_string
    #设置session超时时间
    request.session.set_expiry(60)
	
	#调用BytesIO类，把数据存入内存中
    strem = BytesIO()
    img.save(strem, 'PNG')
    return HttpResponse(strem.getvalue())

html模板

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户登录</title>
    <link rel="stylesheet" href="{% static 'plugins/bootstrap-3.4.1/css/bootstrap.min.css' %}">
    <style>
        .login {
            width: 400px;
        }
    </style>
</head>
<body>
<div class="container login">
    <div class="panel panel-default" style="margin-top: 200px">
        <h2 style="text-align: center">用户登录</h2>
        <div class="panel-body">
            <form class="form" method="post" novalidate>
                {% csrf_token %}
                <div class="form-group">
                    <label>用户名</label>
                    {{ form.name }}
                    <span>{{ form.name.errors.0 }}</span>
                </div>
                <div class="form-group">
                    <label>密码</label>
                    {{ form.password }}
                    <span>{{ form.password.errors.0 }}</span>
                </div>
                <div class="form-group">
                    <label>验证码</label>
                    <div class="row">
                        <div class="col-xs-7">{{ form.code }}</div>
                        <div class="col-xs-5">
                            <a href="#">
                                <img src="/image/code/">
                            </a>
                        </div>
                    </div>

                    <span>{{ form.code.errors.0 }}</span>
                </div>
                <button type="submit" class="btn btn-primary">提交</button>
            </form>
        </div>
    </div>
</div>
</body>
</html>