1. 程式人生 > >09 實現Django自帶的註冊\登入\退出登入(表單)功能

09 實現Django自帶的註冊\登入\退出登入(表單)功能

1、概述

在我們瀏覽網頁的時候,經常會碰到對一個網站的註冊,然後用註冊號進行登入,登入後進行退出的操作。當用戶註冊登入網站後,網站的顯示資訊會根據使用者的許可權來設定。本篇主要簡單介紹django自身的註冊register/登入login表單的運用,以及退出logout檢視的運用。

2、資料層models.py的結構

from django.db import models
# from faker import Factory
from django.contrib.auth.models import User

class Video(models.Model):
    title = models.CharField(null=True, blank=True, max_length=300)
    content = models.TextField(null=True, blank=True)
    url_image = models.URLField(null=True, blank=True)
    cover = models.FileField(upload_to='cover_image', null=True)
    editors_choice = models.BooleanField(default=False)
    def __str__(self):
        return self.title

class UserProfile(models.Model):
    belong_to = models.OneToOneField(to=User, related_name='profile')
    profile_image = models.FileField(upload_to='profile_image')
解析:

a、資料Video是網頁的內容,包括欄位title標題,content內容,url_image圖片連結,cover長傳的圖片等。

b、資料UserProfile是網頁選單中使用者登入後的狀態顯示,原本在模板中用django的user屬性已有使用者名稱顯示,這邊新增一對一關聯的使用者圖片,網頁結構如下:

說明:在未設定登入功能時,訪問網頁後用戶登入狀態的使用者名稱username和圖片是預設的格式,即沒有與使用者關聯。

2、網頁註冊/登入的介面

網頁實現使用者的登入或註冊,通常會有登入或註冊的頁面,本次構建的頁面顯示如下:

說明:使用者的註冊或登入共用一個網頁,只是顯示的表單內容不同。如上是用於登入的表單顯示,使用者正確輸入使用者名稱和密碼即可。

3、在views.py層實現登入和註冊的檢視

1)登入檢視

from django.shortcuts import render, redirect, HttpResponse
from django.contrib.auth import authenticate, login
from django.contrib.auth.forms import UserCreationForm, AuthenticationForm

def index_login(request):
    context = {}
    if request.method == 'GET':
        form = AuthenticationForm
    if request.method == "POST":
        form = AuthenticationForm(data=request.POST)
        if form.is_valid():
            login(request,form.get_user())
            return redirect(to='list')
    context['form'] = form
    return render(request, 'register_login.html', context)

解析:

a、要實現登入的表單,要首先引入django中自帶的登入表單AuthenticationForm;

b、與通常表單類似,使用GET請求渲染表單,使用POST請求來繫結表單;

c、注意AuthenticationForm表單繫結使用引數是data=request.POST,而不能缺少data;

d、不能缺少login(),實現使用者的請求得登入關聯;

2)注視檢視

def index_register(request):
    context = {}
    if request.method == 'GET':
        form = UserCreationForm()
    if request.method == 'POST':
        form = UserCreationForm(request.POST)
        if form.is_valid():
            form.save()
            return redirect(to='login')
    context['form'] = form
    return render(request,'register_login.html', context)
解析:

a、與登入表單類似,要使用GET請求渲染表單,使用POST請求繫結表單;

b、在進行註冊的時候,要判斷註冊號的有效性is_valid(),如註冊名是否已經存在,註冊密碼長度不夠等;

c、注意要jango註冊的表單進行save(),才能算註冊成功。

4、在urls.py層寫入登入和註冊的url以及退出logout檢視

from website.views import index_login, index_register
from django.contrib.auth.views import logout


urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^list/$', listing, name='list'),
    url(r'^list/([A-Za-z]+)$', listing, name='list'),
    url(r'^login/$', index_login, name='login'),
    url(r'^register/$', index_register, name='register'),
    url(r'^logout/$', logout,{'next_page':'/register'}, name='logout'),
]
解析:

a、寫入了登入的url(login),註冊的url(register);

b、通過引入django自帶的退出登入檢視logout來實現退出功能;

c、在退出url中,通過{‘next_page’:'/register'}的格式,實現退出且頁面跳轉至註冊register頁;

5、在模板層進行更改

1)註冊頁面的模板更改

<h4 class="ui inverted right aligned header">
    <a href="{% url 'login' %}" style="color:#ff695e;">or login</a>
    <span>|</span>
    <a href="{% url 'register' %}" style="color:#ff695e;">or register</a>
</h4>

<form class="ui error form", method="POST">
    {% if form.errors %}
      <div class="ui error message">
        {{ form.errors}}
      </div>
      {% for field in form  %}
        <div class="{{ field.errors|yesno:'error, '}} field">
          {{ field.label }}
          {{ field }}
        </div>
      {% endfor %}
    {% else %}
      {% for field in form  %}
        <div class="field">
          {{ field.label }}
          {{ field }}
        </div>
      {% endfor %}
    {% endif %}
    {% csrf_token %}
  <button class="ui inverted red circular right floated button" type="submit">Done</button>
</form>
解析:

a、通過點選註冊頁面的or login或or register實現登入表單和登錄檔單的載入;

b、表單的格式與之前篇章表單手動渲染一樣;

2)列表主頁的模板更改

<div class="right menu">
  {% if request.user.is_authenticated %}
    <div class="item">
        <h5 class="ui inverted header">
          <span>{{ request.user.username }}</span>
          <div class="ui mini circular image">
            {% if request.user.profile.profile_image %}
              <img src="/upload/{{ request.user.profile.profile_image }}" alt="">
            {% else %}
              <img src="{% static 'images/elan-1623088__340.jpg' %}" alt="">
            {% endif %}
          </div>
        </h5>
    </div>
    <div class="item">
        <a href="{% url 'logout' %}" class="ui inverted circular button">Logout</a>
    </div>
  {% else %}
    <div class="item">
        <h5 class="ui inverted header">
          <span>username</span>
          <div class="ui mini circular image">
              <img src="{% static 'images/elan-1623088__340.jpg' %}" alt="">
          </div>
        </h5>
    </div>
    <div class="item">
        <a href="{% url 'login' %}" class="ui inverted circular button">Login</a>
    </div>
  {% endif %}
</div>
解析:

a、通過對請求request的使用者驗證判斷(request.user.is_authenticated)來實現使用者的登入。如果使用者驗證通過,則輸入類似如下:

說明:使用者名稱為註冊成功使用者,圖片為後臺改使用者名稱繫結的上傳的圖片。可以點選Logout實現退出登入。因點選會跳轉到logout的url.

b、登入名通過request.user.usrname來獲取;

c、使用者圖片通過request.user.profile.profilr_image來判斷顯示,即資料models.py層中定義的資料Userprofile是否在後臺有上傳。

d、用於註冊介面如下,當點選Logout退出時,最終會返回到註冊頁:

說明:頁面表單正是通過django登錄檔單實現,可以判斷類似使用者有沒有被註冊等常規判斷。