Python - Django - 登陸頁面

時間 2019-12-05

原文原文鏈接

登陸頁 login.html：css

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="x-ua-compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/fontawesome/css/font-awesome.min.css">
    <title>mysite-登陸頁面</title>
    <style>
        body {
            background-color: #eee;
        }
    </style>
</head>
<body>

<div class="container">
    <div class="row">
        <div class="col-md-4 col-md-offset-4" style="margin-top: 100px">
            <h1 class="text-center">請登陸</h1>
            <form class="form-horizontal" action="/check/" method="post">
                <div class="form-group">
                    <label for="inputEmail3" class="col-sm-2 control-label"></label>
                    <div class="input-group col-sm-8">
                         <span class="input-group-addon"><i class="fa fa-envelope-o fa-fw"></i></span>
                        <input type="email" name="email" class="form-control" id="inputEmail3" placeholder="Email">
                    </div>
                </div>
                <div class="form-group">
                    <label for="inputPassword3" class="col-sm-2 control-label"></label>
                    <div class="input-group col-sm-8">
                        <span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
                        <input type="password" name="pwd" class="form-control" id="inputPassword3" placeholder="Password">
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group col-sm-offset-2 col-sm-8">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox"> 記住我
                            </label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="input-group col-sm-offset-2 col-sm-8">
                        <button type="submit" class="btn btn-primary btn-block">登陸</button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
</body>
</html>

urls.py：html

# -*- coding:utf-8 -*-
__author__ = "MuT6 Sch01aR"

from django.conf.urls import url
from django.contrib import admin
from django.shortcuts import HttpResponse, render, redirect


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


def check(request):
    # 獲取用戶提交的數據
    print(request.POST)  # 取得全部 POST 過來的數據
    return HttpResponse('ok')


# 保存路徑和函數的對應關係
urlpatterns = [
    url(r'^login/', login),
    url(r'check/', check),
]

在登陸界面隨便輸內容python

點擊「登陸」django

這種狀況下要將 settings.py 中的一行代碼註釋掉bootstrap

帶有 CSRF 這個函數

註釋好後從新輸入郵箱和密碼post

返回成功優化

Pycharm 打印出了接收到的 POST 的數據，以字典類型ui

這裏要注意一點的是，這裏的 key 是和 form 表單中的 name 屬性的 email，pwd 相對應的url

接下來判斷郵箱和用戶名是否正確

# -*- coding:utf-8 -*-
__author__ = "MuT6 Sch01aR"

from django.conf.urls import url
from django.contrib import admin
from django.shortcuts import HttpResponse, render, redirect


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


def check(request):
    # 獲取用戶提交的數據
    # print(request.POST)  # 取得全部 POST 過來的數據
    email = request.POST.get("email", None)
    pwd = request.POST.get("pwd", None)
    print(email, pwd)
    # 判斷是否登陸成功
    if email == '1111@qq.com' and pwd == 'test':
        return HttpResponse("登陸成功！")
    else:
        return HttpResponse("登陸失敗！")


# 保存路徑和函數的對應關係
urlpatterns = [
    url(r'^login/', login),
    url(r'check/', check),
]

輸入錯誤的

輸入正確的

將 login 函數和 check 函數合併，根據請求方式來執行相關的操做

# -*- coding:utf-8 -*-
__author__ = "MuT6 Sch01aR"

from django.conf.urls import url
from django.contrib import admin
from django.shortcuts import HttpResponse, render, redirect


def login(request):
    if request.method == "GET":  # 這裏是要大寫的
        return render(request, "login.html")
    if request.method == "POST":
        email = request.POST.get("email", None)
        pwd = request.POST.get("pwd", None)
        print(email, pwd)
        if email == '1111@qq.com' and pwd == 'test':
            return HttpResponse("登陸成功！")
        else:
            return HttpResponse("登陸失敗！")


# 保存路徑和函數的對應關係
urlpatterns = [
    url(r'^login/', login),
]

能夠置空也能夠寫上 /login/，置空就表示當前目錄

優化 login 函數

def login(request):
    if request.method == "POST":
        email = request.POST.get("email", None)
        pwd = request.POST.get("pwd", None)
        print(email, pwd)
        if email == '1111@qq.com' and pwd == 'test':
            return HttpResponse("登陸成功！")
    return render(request, "login.html")

使用 render 添加錯誤提示

在 login.html 中添加一句話

{{ error }} 爲佔位符

def login(request):
    error_msg = ""
    if request.method == "POST":
        email = request.POST.get("email", None)
        pwd = request.POST.get("pwd", None)
        print(email, pwd)
        if email == '1111@qq.com' and pwd == 'test':
            return HttpResponse("登陸成功！")
        else:
            error_msg = "郵箱或密碼錯誤"
    return render(request, "login.html", {"error": error_msg})

登陸時輸入錯誤的郵箱或者密碼

使用 redirect 實現登陸成功後的跳轉

urls.py

# -*- coding:utf-8 -*-
__author__ = "MuT6 Sch01aR"

from django.conf.urls import url
from django.shortcuts import HttpResponse, render, redirect


def login(request):
    error_msg = ""
    if request.method == "POST":
        email = request.POST.get("email", None)
        pwd = request.POST.get("pwd", None)
        print(email, pwd)
        if email == '1111@qq.com' and pwd == 'test':
            return redirect("http://www.baidu.com")
        else:
            error_msg = "郵箱或密碼錯誤"
    return render(request, "login.html", {"error": error_msg})


# 保存路徑和函數的對應關係
urlpatterns = [
    url(r'^login/', login),
]

登陸成功後將跳轉到百度

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。