小白学Django第八天| 登录案例实战

简介: 小白学Django第八天| 登录案例实战

小白学Django系列:


前言

hello,各位小伙伴。学习web知识是少不了登录小案例的,这次我将带着大家一起学习Django的登录案例,尽量把涉及的知识都讲到。这里的登录主要分为两种,一种是普通的表单登录,另一种是ajax登录。在登录案例中,我们也会设计到HTTPrequest,POST,GET等知识。


普通登录

其实学过web的朋友可能已经知道思路了,在前端写好form表单,然后从后端的HTTPrequest对象里拿到传过来的数据。

讲具体案例之前,大家先搞懂POST,GET请求有啥区别(这里我们只说最大的区别):

POST所传的信息是保存在请求头当中(适合安全性较高的数据)

GET则是显示在url当中的, 简单举个例子:www.xxxxx.com/login?user=xxxx&&password=xxxxx

理解完这个就好办,因为我们这里只讲post方法,get方法大家可以自己动手去试试。

那我们的代码就正式开始了。


1.新建login.html并写好表单


<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="UTF-8">
    <title>登录界面</title>
</head>
<body>
<form method="post" action="/login_submit/">
    账号:<input type="text" name="username"></br>
    密码:<input type="password" name="password"></br>
    <input type="submit" value="登录">
</form>
</body>
</html>


大家需要注意的是底下这一行代码


<form method="post" action="/login_submit/">


首先method参数是选用何种方式传送数据,这里显然是post方法。action所对应的就是检查表单中的数据是否正确的视图函数, 例如这里我们就是检查账号密码是否正确。

这里我还得说下为什么需要两个斜线,前面那根斜线是必须得,只是后面这根...如果你不输,那你会报一下错误:


RuntimeError: You called this URL via POST, but the URL doesn’t end in a slash and you have APPEND_SLASH set.


解决的办法有两个: 第一种就是像我上面那样在最后一个字母后加上一根斜线,第二种方法需要在setting文件当中设置APPEND_SLASH=False。


2.在views中编写相应的视图函数

首先我们需要创建login.html所对应的视图函数login


def login(request):
    return render(request, "Book/login.html")


因为这里我们只需要显示login.html,这个界面所以直接返回这个界面就行了。

然后我们来创建检测账号密码是否正确的视图函数login_submit


def login_submit(request):
    # 使用request.POST.get来获取相关的参数
    username = request.POST.get("username")
    password = request.POST.get("password")
    # 模拟判断账号密码是否正确
    if"kuls" == username and"123" == password:
        # 如果账号密码正确,重定向至首页
        return redirect("/index")
    else:
        # 如果错误重定向到登录页面
        return redirect("/login")


大家可能注意到获取post过来的参数,使用的是如下语句


# 使用request.POST.get来获取相关的参数
username = request.POST.get("username")
password = request.POST.get("password")


这里需要说一下,HttpRequest对象的属性GET、POST都是QueryDict类型的对象,与python字典不同,QueryDict类型的对象用来处理同一个键带有多个值的情况,如果一个键同时拥有多个值将获取最后一个值,如果键不存在则返回None值,可以设置默认值进行后续处理。

如果想要获取同一个键的所有值,可以通过方法getlist()获取。

HTTPrequest对象的属性

下面给大家补充一下相关的属性,大家可以依次去尝试。

  • path:一个字符串,表示请求的页面的完整路径,不包含域名和参数部分。
  • method:一个字符串,表示请求使用的HTTP方法,常用值包括:'GET'、'POST'。在浏览器中给出地址发出请求采用get方式,如超链接。在浏览器中点击表单的提交按钮发起请求,如果表单的method设置为post则为post请求。
  • encoding:一个字符串,表示提交的数据的编码方式。如果为None则表示使用浏览器的默认设置,一般为utf-8。这个属性是可写的,可以通过修改它来修改访问表单数据使用的编码,接下来对属性的任何访问将使用新的encoding值。
  • GET:QueryDict类型对象,类似于字典,包含get请求方式的所有参数。
  • POST:QueryDict类型对象,类似于字典,包含post请求方式的所有参数。
  • FILES:一个类似于字典的对象,包含所有的上传文件。
  • COOKIES:一个标准的Python字典,包含所有的cookie,键和值都为字符串。
  • session:一个既可读又可写的类似于字典的对象,表示当前的会话,只有当Django 启用会话的支持时才可用,详细内容见"状态保持"。

ajax登录

这里我先来简单介绍一下ajax是什么?

Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML),是指一种创建交互式、快速动态网页应用的网页开发技术,无需重新加载整个网页的情况下,能够更新部分网页的技术。

通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。(来自百度百科)

在我们上面的表单登录时,会发现每次提交账号密码,都会重新刷新一遍页面(如果账号密码错误),其实我们可以通过ajax来避免这种事情。


微信图片_20220218090956.jpg


在Django中ajax的运行原理跟上图差不多,从浏览器发送ajax请求至服务器,服务器进行处理并且返回一个JsonResponse对象,然后返回json数据,执行回调函数。

在浏览器中使用javascript发起ajax请求时,返回json格式的数据。类JsonResponse继承自HttpResponse对象,被定义在django.http模块中,创建对象时接收字典作为参数。

接下来我们就正式讲解ajax的登录:


1.导入jQuery的文件,并写好html界面及ajax代码

jQuery文件我推荐个网站,大家自行下载:


http://www.jq22.com/jquery-info122


随后导入到static中的js文件中


10.jpg

(需要在setting配置static文件)


login_ajax.html


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>ajax登录</title>
<script src="/static/js/jquery-3.4.1.min.js"></script>
<script>
$(function () {
    $('#ajaxbtn').click(function () {
        username = $('#username').val();
        password = $('#password').val();
        $.ajax({
            url:'/login_ajax_handle/',
            type:'post',
            data:{'username':username, 'password':password},
            dataType:'json',
            //回调函数
            success:function (data) {
            //如果返回是1,则表示登录成功,跳转至首页
            //如果返回是0,则表示登录失败
                if (data.res == 0){
                    $('#errmsg').show().html('账号或密码错误')
                }else{
                    location.href = '/index'
                }}})})})
</script>
<style>
    #errmsg{
        display: none;
        color: red;
    }
</style>
</head>
<body>
<div>
    账号:<input type="text" id="username"></br>
    密码:<input type="password" id="password"></br>
    <input type="button" id="ajaxbtn" value="ajax登录">
    <div id="errmsg"></div>
</div>
</body>
</html>


上述html代码中id为errmsg的div是用来提示我们账号密码错误的。


2.编写视图函数

视图函数login_ajax_handler:


def login_ajax_handle(request):
  # 使用request.POST.get来获取相关的参数
  username = request.POST.get("username")
  password = request.POST.get("password")
  # 模拟判断账号密码是否正确
  if"kuls" == username and"123" == password:
      return JsonResponse({"res": 1})
  else:
      return JsonResponse({"res": 0})


3.结果


11.jpg

密码错误提示


12.jpg

密码正确,跳转至index


Django系列文章:


相关文章
|
11月前
|
数据挖掘 数据库 Python
Django实战:基于Django和openpyxl实现Excel导入导出功能
`openpyxl` 是用于处理 Excel 文件的 Python 库。本文详解其在 Django 项目中的实战应用,涵盖 Excel 文件的生成、下载、上传与解析。
411 0
Django实战:基于Django和openpyxl实现Excel导入导出功能
|
12月前
|
关系型数据库 MySQL 数据库连接
Django数据库配置避坑指南:从初始化到生产环境的实战优化
本文介绍了Django数据库配置与初始化实战,涵盖MySQL等主流数据库的配置方法及常见问题处理。内容包括数据库连接设置、驱动安装、配置检查、数据表生成、初始数据导入导出,并提供真实项目部署场景的操作步骤与示例代码,适用于开发、测试及生产环境搭建。
555 1
|
11月前
|
监控 NoSQL 网络协议
Django 实时通信实战:WebSocket 与 ASGI 全解析(上)
WebSocket 是一种全双工通信协议,支持实时数据传输,适用于聊天、协作、监控等场景。ASGI 是异步 Web 标准,配合 Uvicorn 服务器和 Django Channels,可实现 Django 的 WebSocket 功能,提升实时应用性能。
555 0
|
11月前
|
自然语言处理 开发者 Python
Django 实战:I18N 国际化与本地化配置、翻译与切换一步到位
Django国际化与本地化指南,涵盖i18n和l10n的定义、配置、视图与模型中的翻译使用、消息文件生成与编译,以及多语言登录实战。助你打造多语言支持的Web应用。
543 0
|
10月前
|
缓存 监控 中间件
Django中间件自定义开发指南:从原理到实战的深度解析
Django中间件是Web应用的“交通警察”,在请求与响应过程中进行全局处理,适用于身份验证、日志记录、性能监控等功能。本文详解中间件的工作原理、开发步骤及实战案例,帮助开发者掌握自定义中间件的构建方法,提升Django应用的可维护性与扩展性。
526 0
|
11月前
|
Shell 数据库 网络架构
Django+DRF 实战:从异常捕获到自定义错误信息(下)
本文详解了 Django REST Framework 中 ValidationError 的验证流程与优先级,涵盖字段内置验证、自定义验证方法、对象级验证及数据库约束,并通过实战演示如何自定义异常提示信息。
257 1
Django+DRF 实战:从异常捕获到自定义错误信息(下)
|
11月前
|
人工智能 开发工具 数据库
Django实战:Python代码规范指南
PEP 8 是 Python 官方代码风格指南,提升代码可读性与团队协作效率。本文详解命名规范、注释写法、常用工具(如 Black、flake8)、编程实践与代码优化技巧,助力写出规范、易维护的 Python 代码。
540 7
|
11月前
|
消息中间件 存储 NoSQL
Django 实战:Celery 异步任务从环境搭建到调用全掌握
本文详解 Celery 核心概念、架构组成及工作流程,并实战演示如何在 Django 项目中集成 Celery,实现异步任务调用与事务提交控制,助你掌握从配置到部署的全流程开发技巧。
982 3
|
11月前
|
存储 前端开发 应用服务中间件
Django 实战:静态文件与媒体文件从开发配置到生产部署
Django项目中,静态文件(Static Files)和媒体文件(Media Files)是两类不同用途的文件。本文详细介绍了它们的区别、配置方法以及在开发与生产环境中的处理方式,并结合用户头像上传功能进行实战演示,最后讲解了如何通过Nginx或OpenResty部署静态与媒体文件服务。
527 1
|
11月前
|
Python
Django+DRF 实战:自定义异常处理流程
本文详解DRF异常处理流程,包括默认处理机制与自定义异常处理器的实现方法。通过源码分析和实战示例,讲解如何全局捕获并统一返回错误信息,并结合日志记录与友好提示提升项目健壮性。适用于Django进阶开发。
358 4