#yyds干货盘点# 简简单单实现 Python Web 的登录注册页面，还包含一半逻辑。 _登录注册

得意犹堪夸世俗，诏黄新湿字如鸦。这篇文章主要讲述#yyds干货盘点# 简简单单实现 Python Web 的登录注册页面，还包含一半逻辑。相关的知识，希望能为你提供帮助。
八、Django 用户注册与登录在正式开始本篇博客代码写作之前，需要提前准备一下 sqlite3 相关数据表，已经提前编写好了 menu、submaterial、ingredients 模型，在命令行执行下述代码：

> python manage.py makemigrations Migrations for menuapp: menuapp\\migrations\\0001_initial.py - Create model Menu - Create model SubMaterial - Create model Ingredients > python manage.py migrate Operations to perform: Apply all migrations: admin, auth, contenttypes, menuapp, sessions Running migrations: Applying contenttypes.0001_initial... OK Applying auth.0001_initial... OK ……………… Applying auth.0012_alter_user_first_name_max_length... OK Applying menuapp.0001_initial... OK Applying sessions.0001_initial... OK

8.1 编写注册页面在 templates/menuapp 目录下新建 register.html 文件，该文件继承自 frame.html 文件，具体代码如下：
frame.html 代码修改如下：

% load static % < !DOCTYPE html> < html lang="zh-CN"> < head> < meta charset="utf-8" /> < title> % block title %% endblock%< /title> < link href="https://www.songbingjia.com/android/% static css/bootstrap.min.css %" rel="stylesheet" /> < /head> < body> < nav class="navbar navbar-inverse"> < div class="container"> < div class="navbar-header"> < a rel="nofollow" class="navbar-brand" href="https://www.songbingjia.com/android/#"> 菜谱系统-首页< /a> < /div> < /div> < /nav> % block content %% endblock %< script src="https://www.songbingjia.com/android/% static js/bootstrap.min.js %"> < /script> < /body> < /html>

% extends "menuapp/frame.html" % % block title % 菜谱系统 ---- 注册页面 % endblock % % block content % < div class="container"> < h2 class="form-signin-heading"> 注册< /h2> < form class="form-horizontal" role="form"> < div class="form-group"> < label for="username" class="col-sm-2 control-label"> 用户名：< /label> < div class="col-sm-6"> < input type="text" class="form-control" id="username" placeholder="请输入用户名" /> < /div> < /div> < div class="form-group"> < label for="password" class="col-sm-2 control-label"> 密码：< /label> < div class="col-sm-6"> < input type="password" class="form-control" id="password" placeholder="请输入密码" /> < /div> < /div> < div class="form-group"> < label for="email" class="col-sm-2 control-label"> 邮箱：< /label> < div class="col-sm-6"> < input type="text" class="form-control" id="email" placeholder="请输入邮箱" /> < /div> < /div> < div class="form-group"> < label for="master" class="col-sm-2 control-label"> 权限：< /label> < div class="col-sm-6"> < div class="checkbox"> < label> < input type="checkbox" id="master" /> 管理员 < /label> < /div> < /div> < /div> < div class="form-group"> < div class="col-sm-offset-2 col-sm-6"> < button type="submit" class="btn btn-lg btn-primary btn-block"> 注册 < /button> < /div> < /div> < /form> < /div> % endblock %

在正式运行代码之前，还需要对 urls.py 文件中的路由进行设置，提前将登录也设置完毕，代码如下：

from django.urls import path from . import viewsurlpatterns = [ path("", views.index, name="defalut"), path("register", views.register, name="register"), path("login", views.login, name="login") ]

本部分代码，你可以直接拷贝到你的项目中，因其都是前端相关知识，你也可以自行完成，在浏览器访问 http://127.0.0.1:8000/register，最终得到的效果如下：

#yyds干货盘点# 简简单单实现 Python Web 的登录注册页面，还包含一半逻辑。

文章图片

用户表在下篇博客会有所涉及，本篇博客重点构建出注册与登录页面。
页面编写完毕之后，就要完善对应的后端视图处理部分。逻辑如下：

当用户访问注册页面时，如果用户已经登录，直接跳转到网站首页（后续补充逻辑）；
用户没有登录直接访问注册页面，返回注册用表单页面（本篇博客重点内容）。

修改 menuapp/views.py 文件代码：

from django.shortcuts import render from django.http import HttpResponseRedirect from django.urls import reverse# Create your views here. def index(request): return render(request, "menuapp/index.html")def register(request): if request.user.is_authenticated: return HttpResponseRedirect(reverse("default"))context = "active_menu": default, user: Nonereturn render(request, "menuapp/register.html", context)

代码尤其注意头部文件的导入：

from django.http import HttpResponseRedirect from django.urls import reverse

request.user.is_authenticated 是用户登录验证，写完页面之后，会对其进行说明。
return render(request, "menuapp/register.html", context) 加载 register.html 页面，其中 context 是向页面传递数据。
8.2 注册页面的 POST 与 GET 请求用户注册页面有两种请求状态，这里涉及的是 HTTP 协议相关知识，对于任意一个网页，都存在多种请求方式，例如注册页面的直接访问获取表单，就是 GET 请求，当用户输入信息之后，点击注册按钮，此时为 POST 请求，我们对 HTTP 协议不做过多的说明，先完成功能。
首先修改 register.html，在 form 标签上新增 method 属性，代码如下：

< form class="form-horizontal" role="form" method="post"> < /form>

接下来修改 views.py 中的 register 函数，通过 request 的请求方式不同，处理不同的逻辑。

from django.shortcuts import render from django.http import HttpResponseRedirect from django.urls import reverse# Create your views here. def index(request): return render(request, "menuapp/index.html")def register(request): if request.user.is_authenticated: return HttpResponseRedirect(reverse("default"))# 用户注册状态信息 state = None # 当用户提交注册信息 if request.method == "POST": print(request.POST) username = request.POST.get("username", "") # 此时需要判断数据库中是否存在用户，目前先不处理 password = request.POST.get("password", "") email = request.POST.get("email", "") # 保存注册信息到数据库，本版本先输出 print(username, password, email) state = "success"# 表示注册成功context = "active_menu": default, "user": None, "state": statereturn render(request, "menuapp/register.html", context)

编写完毕，运行代码出现如下错误，该风险为跨站请求问题，在 form 标签内部增加如下代码即可解决，关于原理将在后面讲解。
注意下文增加了一个对用户注册信息状态的验证。

% block content % < div class="container"> < h2 class="form-signup-heading"> 注册< /h2> % if state == "success" % < h2 class="text-success"> 注册成功！< /h2> % endif %< form class="form-horizontal" role="form" method="post"> % csrf_token % < div class="form-group"> < label for="username" class="col-sm-2 control-label"> 用户名：< /label> < div class="col-sm-6"> < input type="text" class="form-control" id="username" name="username" placeholder="请输入用户名" /> < /div> < /div> < /form> < /div>

文章图片

解决该问题之后，注册信息任意输入，点击注册，得到如下页面。

文章图片

8.3 登录页面实现借用注册页面的相同逻辑，对登录页面进行实现。在 templates/menuapp 文件夹下创建 login.html 文件。

% extends "menuapp/frame.html" % % block title % 菜谱系统 ---- 登录页面 % endblock % % block content % < div class="container"> < h2 class="form-signup-heading"> 登录< /h2> % if state == "success" % < h2 class="text-success"> 登录成功！< /h2> % endif %< form class="form-horizontal" role="form" method="post"> % csrf_token % < div class="form-group"> < label for="username" class="col-sm-2 control-label"> 用户名：< /label> < div class="col-sm-6"> < input type="text" class="form-control" id="username" name="username" placeholder="请输入用户名" /> < /div> < /div> < div class="form-group"> < label for="password" class="col-sm-2 control-label"> 密码：< /label> < div class="col-sm-6"> < input type="password" class="form-control" id="password" name="password" placeholder="请输入密码" /> < /div> < /div> < div class="form-group"> < div class="col-sm-offset-2 col-sm-6"> < button type="submit" class="btn btn-lg btn-primary btn-block"> 登录 < /button> < /div> < /div> < /form> < /div> % endblock %

修改 views.py 页面代码，实现登录简单逻辑部分。

# 登录视图 def login(request): if request.user.is_authenticated: return HttpResponseRedirect(reverse("default")) # 登录状态信息 state = None if request.method == "POST": username = request.POST.get("username", "") password = request.POST.get("password", "") # 通过用户名和密码验证用户是否可以登录，步骤先省略state = "success"context = "active_menu": default, "user": None, "state": statereturn render(request, "menuapp/login.html", context)

运行代码，在浏览器访问 http://127.0.0.1:8000/login，得到如下界面，对其进行用户名与密码输入，获取登录成功提示信息。