天天看點

django2.0 快速實作登入

django2.0 快速實作登入

感想:

自己在網上搜尋的一些部落格裡面的django的文章,有一些不完整,或者django的版本還是低版本,需要自己去修改,對于web應用來說,包括資料庫的建立,前端頁面的開發,以及中間邏輯層的處理三部分。 其實這些基本上是套路,能夠熟悉應用就好。

本操作環境:

虛拟環境:django2.0 python3.5(應該python3.6都可以使用) window10

1.建立項目與應用(項目和應用都是自己制定的)

建立項目:django-admin startproject login

然後進入login檔案夾裡面 cd login

在目前目錄下面建立一個app應用

python manage.py startapp app

操作順序如下,workon django2.0,—->這個相當于開啟虛拟環境(django2.0是虛拟環境的名稱,自己随便定),啟動虛拟環境之後,指令行提示符左邊會有你使用的虛拟環境的名稱出現

ps.如果自己的電腦上沒裝過django,最好直接安裝最新版的,因為本文章是關于django2.0+python3.5的,當然也可以使用虛拟環境,網上都有這樣的文章,之後我會寫一篇使實用的虛拟環境的文章

F:\益達學習\django\django2.0項目>workon django2.0
(django2.0) F:\益達學習\django\django2.0項目>django-admin startproject login

(django2.0) F:\益達學習\django\django2.0項目>cd login

(django2.0) F:\益達學習\django\django2.0項目\login>python manage.py startapp app
           

login檔案夾的目錄結構如下:檢視目錄結構的—>tree /f

(django2) F:\益達學習\django\django2項目\login>tree /f
卷 娛樂 的檔案夾 PATH 清單
卷序列号為 FEA8-CC1
F:.
│  manage.py
│
├─app
│  │  admin.py
│  │  apps.py
│  │  models.py
│  │  tests.py
│  │  views.py
│  │  __init__.py
│  │
│  └─migrations
│          __init__.py
│
└─login
    │  settings.py
    │  urls.py
    │  wsgi.py
    │  __init__.py
    │
    └─__pycache__
            settings.cpython-pyc
            __init__.cpython-pyc
           

打開login\login\settings.py檔案,将app(應用的名字)應用添加進去,同時進行一些設定

# Application definition

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app',      #注意後面那個分号記得打上去
]

#注釋csrf,以防再次出現403的錯誤 

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    #'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
]

#設定為中文格式,使背景系統使用中文展示,和修改時間,這個看個人,有需要就修改
#設定編碼、時區,不要使用zh-cn,這個不能用了
LANGUAGE_CODE = 'zh-hans'

TIME_ZONE = 'Asia/Shanghai'
           

2.設計/修改Model(資料庫)

打開login\app\models.py檔案,添加如下内容:

from django.db import models

class User(models.Model):
    username = models.CharField(max_length = 50)
    password = models.CharField(max_length = 50)
           

建立兩個字段,使用者存放使用者名、密碼等。

生成遷移檔案:根據模型類生成sql語句,遷移檔案被生成到應用(app)的migrations目錄

python manage.py makemigrations

執行遷移:執行sql語句生成資料表

python manage.py migrate

(django2) F:\益達學習\django\django2項目\login>python manage.py makemigrations
Migrations for 'app':
  app\migrations\_initial.py
    - Create model User

(django2) F:\益達學習\django\django2項目\login>python manage.py migrate
Operations to perform:
  Apply all migrations: admin, app, auth, contenttypes, sessions
Running migrations:
  Applying contenttypes_initial... OK
  Applying auth_initial... OK
  Applying admin_initial... OK
  Applying admin_logentry_remove_auto_add... OK
  Applying app_initial... OK
  Applying contenttypes_remove_content_type_name... OK
  Applying auth_alter_permission_name_max_length... OK
  Applying auth_alter_user_email_max_length... OK
  Applying auth_alter_user_username_opts... OK
  Applying auth_alter_user_last_login_null... OK
  Applying auth_require_contenttypes_0002... OK
  Applying auth_alter_validators_add_error_messages... OK
  Applying auth_alter_user_username_max_length... OK
  Applying auth_alter_user_last_name_max_length... OK
  Applying sessions_initial... OK
           

3.啟動伺服器,檢視有沒有錯誤出現

在此之前要建立超級管理者,以便登入到admin背景管理系統

建立管理者的密碼是有一定規則的,還有就是郵件位址可以不寫

(django2.0) F:\益達學習\django\django2.0項目\login>python manage.py createsuperuser
Username (leave blank to use 'asus-pc'): xyyojl
Email address:
Password:
Password (again):
Superuser created successfully.
           

通路http://127.0.0.1:8000/,看到django2.0的首頁

django2.0 快速實作登入

通路admin

http://127.0.0.1:8000/admin/

登入使用者名和密碼是我剛才建立的管理者的使用者和密碼

django2.0 快速實作登入

進入到裡面之後,隻要預設的東西,因為我還沒有在admin裡面注冊模型

django2.0 快速實作登入

3.建立視圖(views.py)

①打開login\app\views.py檔案,添加如下内容:

from django.shortcuts import render,render_to_response
from django.http import HttpResponseRedirect
from django import forms
from app.models import User
# Create your views here.
#定義表單模型
class UserForm(forms.Form):
    username = forms.CharField(label = '使用者名 :',max_length = )
    password = forms.CharField(label = '密碼 :',widget = forms.PasswordInput())

#登入
def login(request):
    if request.method == 'POST':
        uf = UserForm(request.POST)
        if uf.is_valid():
            #擷取表單使用者密碼
            username = uf.cleaned_data['username']
            password = uf.cleaned_data['password']
            #擷取的表單資料與資料庫進行比較
            user = User.objects.filter(username__exact = username,password__exact = password)
            if user:
                return render_to_response('success.html',{'username':username})
            else:
                return HttpResponseRedirect('/login/')
    else:
        uf = UserForm()  
    return render_to_response('login.html',{'uf':uf}) 
           

登入的核心是拿到使用者填寫的表單資料(使用者名、密碼)與資料庫裡面的User表中的字段進行比較,根據比較結果做出不同的反應,如果在資料庫有這些資訊的話,就成功跳轉到success.html頁面(比較簡陋),如果失敗的話,還停留在原來的login.html,應該有一些提示功能比如是你輸出的資訊錯誤,請想想再輸入之類的,後期繼續完善。

4.建立前端頁面

在邏輯層提到了兩個頁面,一個登入頁面(login.html),一個登入成功頁面(success.html)。是以我們要把這兩個頁面建立出來。

先在login\app目錄下建立templates目錄,接着在login\app\templates目錄下建立login.html 檔案:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>登入</title>
    <style>
        body{
            background-color: rgb(, , );
            font-size: px;
        }
        .login{
            width: px;
            height: px;
            margin: px auto;
            border:px solid rgb(, ,);
        }
        .login form{
            width: px;
            background-color: rgb(,,);
        }
        .login .forms{
            width: px;
            margin:  auto;
            padding:px  px ;
        }
        .login label{
            display: inline-block;
            width: px;
            padding-bottom: px;
        }
        .login input{
            width: px;
            height: px;
            border:none;
            outline: none;
            border:px solid rgb(, ,);
            background-color: #fff; 
            font-size: px;
            text-indent: px;
            border-radius: px;
        }
        .btn{
            width: px;
            padding: px ;
            border-top: px solid #ccc;
            background-color:rgb(,,);
        }
        .btn div{
            overflow: hidden;
            width: px;
            margin:  auto;
        }
        .btn button{
            float:right;
            padding:px px;
            background: rgb(, , );
            border:px solid #ccc;
            border-radius: px;
            color: #fff;
        }
        .btn a{
            float:left;
            padding: px ;
            text-decoration: none;
            color:#ccc;
        }
    </style>
</head>
<body>
    <div class="login">
        <form action="" method="post"  enctype="multipart/form-data">
           <div class="forms">
                {% csrf_token %}
                {{uf.as_p}}
           </div>
            <div class="btn">
                <div>
                    <a href="#">忘記密碼?</a>
                    <button type ='submit'>登入</button>
                </div>
            </div>
        </form>
    </div>
</body>
</html>
           

在login/app/templates/目錄下建立success.html 檔案:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>歡迎{{username}}</title>
</head>
<body>
    <h1>恭喜{{username}},登入成功!</h1>
</body>
</html>
           

5.設定url

打開login\login\urls.py檔案,添加如下内容:

from django.contrib import admin
from django.urls import path,include

urlpatterns = [
    path('admin/', admin.site.urls),
    #http://127.0.0.1:8000/login/
    path('login/',include('app.urls')),
]
           

在login\app目錄下建立urls.py檔案:

from django.urls import path
from app import views
#from . import views  這個也可以使用,跟上面那個一樣的
urlpatterns = [
    path('', views.login,name = 'login'),
]
           

6.向admin注冊User的模型

打開login/app/admin.py檔案,注冊模型,添加如下内容:

from django.contrib import admin

# Register your models here.
from app.models import User
admin.site.register(User)
           

7.通路注冊頁面

目前面的工作都做完之後,我們啟動伺服器

(django2) F:\益達學習\django\django2項目\login>python manage.py runserver
Performing system checks...

System check identified no issues ( silenced).
May ,  - ::
Django version , using settings 'login.settings'
Starting development server at http://:/
Quit the server with CTRL-BREAK.
           

通路http://127.0.0.1:8000/admin/

django2.0 快速實作登入

然後添加一個user,填寫使用者名和密碼

django2.0 快速實作登入

通路http://127.0.0.1:8000/login/

使用上面增加的user的資訊,登入

django2.0 快速實作登入

登入成功的頁面時:

django2.0 快速實作登入

注意:上面這是簡單的實作登入,并不是完整的,隻是實作大體的的功能,希望多多體諒

參考資料:蟲師的django快速實作檔案上傳