使用Django框架自带的Form表单完成简单的用户登录注册

如果不知道怎么配置Django环境以及如何连接数据库请点击我的上一篇博客:
使用pycharm初始化Django框架并连接Sql Server

文章目录

  • 1.Django默认生成的数据表
  • 2.用户登录
    • 2.1创建登录页面
    • 2.2视图处理登录请求
    • 2.3配置访问路径
  • 3.用户注册
    • 3.1创建用户表单
    • 3.2创建注册模版页面
    • 3.3创建视图注册处理函数
    • 3.4配置 URL
  • 4.效果演示
    • 4.1注册
    • 4.2登录

1.Django默认生成的数据表

  • auth_user: 存储用户的基本信息,包括用户名、密码(加密后)、电子邮件、姓名等。这个表用于支持用户身份验证系统。
  • auth_group: 存储用户组的信息,用于对用户进行分组管理。
  • auth_permission: 存储权限信息,用于管理用户和用户组的权限。
  • auth_user_groups: 用户和用户组的关联表,用于表示用户属于哪些用户组。
  • auth_user_user_permissions: 用户和权限的关联表,用于表示用户具有哪些权限。
  • django_session: 用于存储用户会话信息,包括用户的会话密钥和会话数据。
  • django_migrations: 记录了数据库迁移的历史信息,包括迁移文件的名称、应用程序名称、迁移状态等。
  • django_content_type: 用于存储模型的元数据信息,包括模型的应用程序名称、模型名称等。
  • django_admin_log: 用于记录管理员操作日志的表,包括了对数据的增删改查等操作记录。
    这些默认数据表是 Django 框架提供的核心组件,用于支持其内置功能,如身份验证、权限管理、会话管理等。它们可以根据需要进行扩展和定制,也可以通过 Django 的 ORM(对象关系映射)来进行操作和查询。本次登录注册可以使用auth_user这张数据表来完成。

2.用户登录

2.1创建登录页面

在Django项目中template目录创建user_login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f4f4f4;
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
        }
        .login-container {
            background-color: #fff;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
             width: 400px; /* 修改宽度 */
            height: 400px;
            margin: 20px; /* 添加外边距 */
        }
        .login-container h2 {
            text-align: center;
        }
        .login-container form {
            display: flex;
            flex-direction: column;
        }
        .login-container form input[type="text"],
        .login-container form input[type="password"] {
            margin-bottom: 15px;
            padding: 10px;
              margin-top: 10%;
            border-radius: 4px;
            border: 1px solid #ccc;
            font-size: 16px;
        }
        .login-container form input[type="submit"] {
              margin-top: 20%;
            background-color: #007bff;
            color: #fff;
            border: none;
            padding: 10px;
            border-radius: 4px;
            cursor: pointer;
            font-size: 16px;
            transition: background-color 0.3s ease;
        }
        .login-container form input[type="submit"]:hover {
            background-color: #0056b3;
        }
    </style>
</head>
<body>
    <div class="login-container">
        <h2>用户登录</h2>
        <form  method="post">
              {% csrf_token %}
            <input type="text" name="username" placeholder="Username" required>
            <input type="password" name="password" placeholder="Password" required>
            <input type="submit" value="Login">
        </form>
    </div>
</body>
</html>

2.2视图处理登录请求

在项目目录中新建 reader_controller.py(一般命名为views.py 笔者写SpringBoot项目习惯了 以controller为结尾命名了)

def reader_login(request):
    if request.method == 'POST':
        username = request.POST.get('username')
        password = request.POST.get('password')
        if username and password:
            # 进行身份验证
            user = authenticate(username=username, password=password)
            if user is not None:
                # 读者验证成功,执行逻辑或重定向到其他页面
                return HttpResponse('登录成功')
            else:
                return HttpResponse('无效的凭据')
        else:
            return HttpResponseBadRequest('请提供用户名和密码')
    return render(request, 'user_login.html')  # 渲染 user_login.html 模板

authenticate函数详解: Django 中用于进行用户身份验证的函数。它用于验证用户提供的凭据(例如用户名和密码)是否有效,并返回相应的用户对象。

  1. 接收用户凭据: authenticate() 函数接收用户提供的凭据,通常是用户名和密码。
  2. 验证凭据: 它在数据库中查找具有提供的用户名的用户对象,然后尝试使用提供的密码对该用户进行验证。默认查询框架自带的auth_user数据表,可以在settings.py修改,改为自己的用户模型,这里以auth_user数据表举例,不过多赘述。
  3. 返回用户对象: 如果提供的凭据有效并且验证通过,authenticate() 将返回相应的用户对象。否则,它将返回 None。

2.3配置访问路径

将路径与视图处理函数进行绑定,以便进行访问页面
 path('login/', reader_controller.reader_login, name='reader_login'),

3.用户注册

3.1创建用户表单

Django 框架提供了表单组件,可以用于对页面进行初始化,生成 HTML 标签,此外还可以对用户提交的数据进行校验(显示错误信息)。在项目目录下新建forms.py文件

from django import forms
from django.contrib.auth.forms import UserCreationForm
from django.contrib.auth.models import User


class SignUpForm(UserCreationForm):
    email = forms.EmailField(max_length=254, help_text='必填字段')
    password1 = forms.CharField(
        label="密码",
        strip=False,
        widget=forms.PasswordInput(attrs={'autocomplete': 'new-password'}),
        help_text="至少8个字符"
    )
    password2 = forms.CharField(
        label="重复输入密码",
        widget=forms.PasswordInput(attrs={'autocomplete': 'new-password'}),
        strip=False,
        help_text="再次输入密码"
    )

    username = forms.CharField(
        label="用户名",
        help_text="必填字段"
    )

    class Meta:
        model = User
        fields = ('username', 'password1', 'password2', 'email')

这里定义了表单四个字段,并对提示进行了重载, 可以只定义 class Meta,那样显示的是默认效果。

3.2创建注册模版页面

在目录下的templates文件夹下新建signup.html

<!DOCTYPE html>
<html>
<head>
    <title>注册</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
    <!-- 引入 Bootstrap 样式表 -->
    <style>
        /* 自定义额外样式 */
        .form-signup {
            max-width: 400px;
            margin: 0 auto;
            padding: 15px;
            border: 1px solid #ccc;
            border-radius: 5px;
            background-color: #f9f9f9;
        }

        .form-signup h2 {
            margin-bottom: 20px;
        }

        .form-signup label {
            font-weight: bold;
            display: block;
            margin-bottom: 5px; /* 调整标签和输入框之间的间距 */
        }

        .form-signup input[type="text"],
        .form-signup input[type="password"],
        .form-signup input[type="email"] {
            width: 100%;
            padding: 8px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
            box-sizing: border-box;
        }

        .form-signup .btn-primary {
            margin-top: 20px;
        }
    </style>
</head>
<body>

<div class="container mt-5">
    <h2 class="text-center mb-4">用户注册</h2>
    <form method="post" class="form-signup">
        {% csrf_token %}
        {{ form.as_p }}
        <button type="submit" class="btn btn-primary btn-block">注册</button>
    </form>
</div>

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<!-- 引入 Bootstrap JavaScript -->
</body>
</html>

其中 {{ form.as_p }} 代表了引用了Django的form表单,并以p标签的形式显示。同时页面使用bootstrap框架进行了稍微了美化

3.3创建视图注册处理函数

在视图中处理用户提交的注册表单。

def signup(request):
    if request.method == 'POST':
        form = SignUpForm(request.POST)
        if form.is_valid():
            form.save()
            return redirect('/login')  # 注册成功后重定向到登录页面或其他页面
        print(form.errors)        # 打印错误信息
    else:
        form = SignUpForm()
    return render(request, 'signup.html', {'form': form})

如果使用了Django的form组件,可以直接获取form表单,并对字段进行校验,创建新用户并保存到数据库中。如果校验不通过,将继续返回注册页面重新注册

3.4配置 URL

from django.contrib import admin
from django.urls import path
from . import reader_controller
urlpatterns = [
    path('admin/', admin.site.urls),
    path('login/', reader_controller.reader_login, name='reader_login'),
    path('signup/', reader_controller.signup, name='reader_signup'),
]

4.效果演示

4.1注册

在浏览器输入http://127.0.0.1:8000/signup/
在这里插入图片描述
注册成功之后,将跳转到登录页面。查看数据库进行验证,可以发现,django 自动帮我们进行了密码加密,并且添加了其他的字段,非常的方便
在这里插入图片描述

4.2登录

当注册成功后自动跳转到登录页面,也可以在浏览器直接通过地址访问
在这里插入图片描述
当数据库数据匹配成功后,将会跳转到登录成功页面。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/305500.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

linux系统基础知识-基础IO

IO 概念引入位图的概念IO的系统调用函数openwriteread()close简单使用样例&#xff1a; 文件描述符fd默认文件流stdin/stdout/stderr文件描述符的分配规则 重定向的概念输出重定向输入重定向追加重定向dup2()系统调用总结 文件缓冲区深入理解缓冲区的概念输出缓冲区部分代码解释…

jmeter循环控制器

1.循环控制器 简单粗暴 写几次 循环几次 经常结合自定义变量使用 2.foreach控制器 搭配 变量一起使用的循环 一般变量的值是一个集合或者 是2个及2个以上的内容

BERT 模型是什么

科学突破很少发生在真空中。相反&#xff0c;它们往往是建立在积累的人类知识之上的阶梯的倒数第二步。要了解 ChatGPT 和 Google Bart 等大型语言模型 &#xff08;LLM&#xff09; 的成功&#xff0c;我们需要回到过去并谈论 BERT。 BERT 由 Google 研究人员于 2018 年开发&…

软件测试笔记

文章目录 基础知识1.常见测试分类2.质量模型3.测试流程4.用例5.等价类6.边界值分析方法7.判定表8.流程图9.场景法10.错误推测法11.缺陷12.缺陷编写13.缺陷管理工具注&#xff1a;内容和图片来自黑马程序员视频。 基础知识 1.常见测试分类 按阶段划分 (1)单元测试&#xff1a…

详解java继承

目录 一 、为什么需要继承 二、准备工作&#xff1a;用java代码先定义狗类、猫类、动物类&#xff0c;这是代码准备如下 三、继承代码实现 四、 子类中访问父类的成员方法 4.1. 成员方法名字不同 4.2 成员方法名字相同 五、子类构造方法 扩展&#xff1a;如果你对子类和…

手撕 PCA

PCA&#xff08;Principal Component Analysis&#xff09;&#xff0c;中文名称&#xff1a;主成分分析。迄今为止最流行的降维算法。 假设 n 维空间中的一个单位立方体&#xff0c;易知&#xff1a;一维空间中该立方体中任意两点的距离不超过 1 1 1&#xff0c;二维空间中该…

系列十四、while do...while switch模板代码

一、while & do...while & switch模板代码 1.1、while /*** 需求&#xff1a;使用while循环打印5遍Hello World!*/ Test public void print5() {int i 1;while (i < 5) {System.out.println("Hello World! " LocalDateTime.now());// 线程休眠&#x…

批量置入视频封面:一分钟教程,简单易学

在视频制作过程中&#xff0c;为视频添加引人注目的封面是吸引观众的关键。而当我们需要批量处理多个视频时&#xff0c;如何快速、准确地置入封面就显得尤为重要。本文将为您揭示这一高效技巧&#xff0c;让您在一分钟内学会批量置入视频封面&#xff0c;提升视频的吸引力与观…

GEC6818 智能语音家居系统——原神主题的平板

GEC6818 智能语音家居系统——原神主题的平板 文章目录 GEC6818 智能语音家居系统——原神主题的平板一、 滑动解锁密码解锁二、 在桌面有两种方式可以进行选择2.1 普通点击模式2.1.1 电子相册2.1.2 监控2.1.3 画板2.1.4 视频播放2.1.5 五子棋小游戏2.1.6 烟雾传感器GY39RFID 2…

独家原创:“ARO算法的再进化,BMARO的创新改进与卓越表现“

人工兔优化算法ARO作为一种近期比较好的优化算法&#xff0c;深受人们和编辑的喜爱。 人工兔优化算法&#xff08;Artificial Rabbit Optimization, ARO&#xff09;是一种基于自然界兔子行为的启发式优化算法。该算法通过模拟兔子在寻找食物和规遍领地时的智能行为&#xff0…

Java药物不良反应ADR智能监测系统源码

药物不良反应&#xff08;Adverse Drug Reaction&#xff0c;ADR&#xff09;是指在使用合格药品时&#xff0c;在正常的用法和用量下出现的与用药目的无关的有害反应。这些反应往往因药物种类、使用方式、个体差异等因素而异&#xff0c;可能导致患者身体不适、病情恶化。 为保…

Linux shell jq工具操作文档(jq --help使用示例)

文章目录 jq工具介绍jq --help解读英文中文 使用示例1. 使用最简单的过滤器。将输入复制到输出&#xff0c;不做任何修改&#xff08;除了格式化&#xff09;2. 使用 -c 选项进行紧凑输出而非美化输出3. 使用 -n 选项以 null 作为单一输入值&#xff08;用于创建新json&#xf…

podman configure insecure certificate registry【podman 设置非安全镜像仓库】

预备条件 docker registry仓库私搭并配置证书centos 7.9 部署 harbor 镜像仓库实践harbor 部署入门指南Podman 部署私有镜像仓库 设置 $ vim /etc/hosts 192.168.23.47 registry.ghostwritten.com$ vim /etc/containers/registries.conf ... [[registry]] location "r…

网工内推 | 运维工程师,国企、上市公司,RHCE认证优先

01 广东机场白云信息科技股份有限公司 招聘岗位&#xff1a;基础架构运维工程师&#xff08;中级&#xff09; 职责描述&#xff1a; 1、参与公司业务系统的监控、巡检、维护、故障定位、原因分析&#xff1b; 2、负责业务系统的上线、升级割接工作&#xff1b; 3、负责服务器…

RequestMapping注解的使用和常见的GET和POST请求方式

RequestMapping注解的使用和常见的GET和POST请求方式 1、使用说明 作用&#xff1a;用于建立请求URL和处理请求方法之间的对应关系。 出现位置&#xff1a; 类上&#xff1a; 请求 URL的第一级访问目录。此处不写的话&#xff0c;就相当于应用的根目录。写的话需要以/开头。它…

家用洗地机哪款性价比高,口碑最好的洗地机推荐

随着社会生活水平的提高和人们对卫生的迫切关注&#xff0c;洗地机在家庭清洁中扮演着至关重要的角色。其成为现代生活中的清洁利器&#xff0c;既满足了人们对卫生的需求&#xff0c;又符合人们对清洁方式的追求。但是面对市面上满目琳琅的洗地机品牌&#xff0c;究竟如何选呢…

linux开发板静态IP无法ping通外网

硬件平台&#xff1a;韦东山的6ull开发板 问题&#xff1a; 使用网线直连路由器&#xff0c;动态获取IP时能ping通外网&#xff1b; 改为静态IP时&#xff0c;能ping通局域网&#xff0c;但无法ping通外网。 改为静态IP&#xff1a;修改/etc/network/interfaces 测试&#…

【Kubernetes】如何使用 kubectl 操作 cluster、node、namespace、pod

如何使用 kubectl 操作 cluster、node、namespace、pod 在列出、描述、修改或删除其他命名空间中的对象时&#xff0c;需要给 kubectl 命令传递 --namespace&#xff08;或 -n&#xff09;选项。如果不指定命名空间&#xff0c;kubectl 将在当前上下文中配置的默认命名空间中执…

Unity 利用UGUI之Scrollbar制作进度条

在Unity中除了用Slider、Image做进度条&#xff0c;其实用Scrollbar也可以做进度条。 首先&#xff0c;在场景中新建一个Scrollbar组件和一个Text组件&#xff1a; 其次&#xff0c;创建模拟进度的一个脚本&#xff0c;Scrollbar_Progressbar.cs: using System.Collections; …
最新文章