第14章节-Python3.5-Django实现用户登录与前端交互 13

简介: 用户名和密码验证:首先在settings.py 把csrf注释如图:image.pngimage.png修改login.html 代码如下: Title lab...

用户名和密码验证:

首先在settings.py 把csrf注释如图:

image.png
image.png

修改login.html 代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/commons.css" />
    <style>
        label{
            width: 80px;
            text-align: right;
            display: inline-block;
        }
    </style>
</head>
<body>
    <form action="/login" method="post">
        <p>
            <label for="username">用户名:</label>
            <input id="username" name="user" type="text" />
        </p>
        <p>
            <label for="password">密码:</label>
            <input id="password" name="pwd" type="password" />
            <input type="submit" value="提交" />
            <span style="color: red;">{{ error_msg }}</span>
        </p>
    </form>
    <script src="/static/jquery.min.js"></script>
</body>
</html>

注意form不要写错


image.png
  • 修改


    image.png
  • 修改views.py 代码如下:
from django.shortcuts import render

# Create your views here.
from django.shortcuts import HttpResponse
from django.shortcuts import render


def login(request):
    # 包含用户提交的所有信息

    # 获取用户提交方法
    print(request.method)

    return render(request, 'login.html')


# def login(request):
#     # f = open('templates/login.html', 'r', encoding='utf-8')
#     # date = f.read()
#     # f.close()
#     # return HttpResponse(date)
#     return render(request,'login.html')


def home(request):
    return HttpResponse('<h1>CMDB</h1>')

  • 运行django访问(http://127.0.0.1:8000/login)

  • 效果图如下(GET方式访问服务器):


    image.png
  • 能得到用户是用GET方式访问服务器


    image.png
    • 效果图如下(POST方式访问服务器)点击提交:


      image.png

      image.png
  • 获取用户表单输入的数据:

image.png
  • 修改views.py 代码如下:
from django.shortcuts import render

# Create your views here.
from django.shortcuts import HttpResponse
from django.shortcuts import render


def login(request):
    # 包含用户提交的所有信息
    # 获取用户提交方法
    # print(request.method)
    # 判断用户名和密码
    if request.method == "POST":
        # 获取用户通过POST提交过来的数据
        user = request.POST['user']
        pwd = request.POST['pwd']
        print(user,pwd)

    return render(request, 'login.html')


# def login(request):
#     # f = open('templates/login.html', 'r', encoding='utf-8')
#     # date = f.read()
#     # f.close()
#     # return HttpResponse(date)
#     return render(request,'login.html')


def home(request):
    return HttpResponse('<h1>CMDB</h1>')

  • 运行(效果图)


    image.png
image.png

上述再修改views.py 进行改进:

  • views.py :
from django.shortcuts import render

# Create your views here.
from django.shortcuts import HttpResponse
from django.shortcuts import render
# 重定向
from django.shortcuts import redirect


def login(request):
    # 包含用户提交的所有信息
    # 获取用户提交方法
    # print(request.method)
    # 判断用户名和密码
    if request.method == "POST":
        # 获取用户通过POST提交过来的数据(用户不存在返回None)
        user = request.POST.get('user',None)
        pwd = request.POST.get('pwd',None)
        if user == 'root' and pwd == "123":
            # 去跳转到(重定向)
            return redirect('http://www.baidu.com')
        # user = request.POST['user']
        # pwd = request.POST['pwd']
        # print(user,pwd)

    return render(request, 'login.html')


# def login(request):
#     # f = open('templates/login.html', 'r', encoding='utf-8')
#     # date = f.read()
#     # f.close()
#     # return HttpResponse(date)
#     return render(request,'login.html')


def home(request):
    return HttpResponse('<h1>CMDB</h1>')


image.png

输入(u: root, m: 123)


image.png
  • 效果图:


    image.png
  • 扩充
  • views.py 添加以下({'error_msg': '123'}):


    image.png
  • 注意这里:


    image.png

效果图(不输入密码):


image.png

上述再修改:

image.png
  • 修改views.py 代码如下:
from django.shortcuts import render

# Create your views here.
from django.shortcuts import HttpResponse
from django.shortcuts import render
# 重定向
from django.shortcuts import redirect


def login(request):
    # 包含用户提交的所有信息
    # 获取用户提交方法
    # print(request.method)
    # 判断用户名和密码
    error_msg = ""
    if request.method == "POST":
        # 获取用户通过POST提交过来的数据(用户不存在返回None)
        user = request.POST.get('user',None)
        pwd = request.POST.get('pwd',None)
        if user == 'root' and pwd == "123":
            # 去跳转到(重定向)
            return redirect('http://www.baidu.com')
        else:
            # 用户密码不正确
            error_msg = "用户名或密码错误"
        # user = request.POST['user']
        # pwd = request.POST['pwd']
        # print(user,pwd)

    return render(request, 'login.html', {'error_msg': error_msg})


# def login(request):
#     # f = open('templates/login.html', 'r', encoding='utf-8')
#     # date = f.read()
#     # f.close()
#     # return HttpResponse(date)
#     return render(request,'login.html')


def home(request):
    return HttpResponse('<h1>CMDB</h1>')

image.png
image.png
  • 效果图:


    image.png
目录
相关文章
|
2月前
|
前端开发 API UED
Python后端与前端交互新纪元:AJAX、Fetch API联手,打造极致用户体验!
Python后端与前端交互新纪元:AJAX、Fetch API联手,打造极致用户体验!
78 2
|
24天前
|
JavaScript 前端开发 Python
django接收前端vue传输的formData图片数据
django接收前端vue传输的formData图片数据
23 4
|
22天前
|
关系型数据库 MySQL 数据库
Mysql学习笔记(四):Python与Mysql交互--实现增删改查
如何使用Python与MySQL数据库进行交互,实现增删改查等基本操作的教程。
49 1
|
27天前
|
Python
Python软链接:Python 2与现代Python的交互
Python软链接:Python 2与现代Python的交互
|
1月前
|
前端开发 API 开发者
从零到精通,AJAX与Fetch API让你的Python Web前后端交互无所不能!
从零到精通,AJAX与Fetch API让你的Python Web前后端交互无所不能!
37 3
|
17天前
|
前端开发 Python
帮我用python作为网页前端输出“hallow world
帮我用python作为网页前端输出“hallow world
|
2月前
|
Python
Python软链接:Python 2与现代Python的交互 原创
Python软链接:Python 2与现代Python的交互 原创
|
2月前
|
关系型数据库 MySQL Python
pymysql模块,python与MySQL之间的交互
pymysql模块,python与MySQL之间的交互
|
27天前
|
Python
Python软链接:Python 2与现代Python的交互
Python软链接:Python 2与现代Python的交互
|
2月前
|
关系型数据库 MySQL 数据库
python之excel与mysql之间的交互
python之excel与mysql之间的交互