這一段時間沒有更新部落格，因為一些其他原因，玩心最近有點泛濫，dota2的時間也增加了很多。
我意識到這樣是不對的，隻有提升技術，提升自我，才能實作自己的人生理想，做一名心目中的技術人才
文章目錄
- 部落格登入簡介
- MTV逐漸建構
-
- Model建構
- 視圖函數建構
-
- 登陸的前端模闆
- 登入成功後修改導航欄内容
- 總結
部落格登入簡介
作為一個（自認為）比較成熟的項目，多使用者互動是少不了的，要把使用者名、密碼等資訊儲存在資料庫中。這一部分，我本應駕輕就熟。
我曾經用Flask架構自己實作了登入功能，并且引入了短信驗證、郵箱驗證等稍微進階一點的功能。
準備用自己的經驗直接建構登入的MTV子產品，誰知……django架構自帶登入功能，那我就不要自己傻乎乎的去寫了，來弄一個demo吧。
MTV逐漸建構
話不多說
python manage.py startapp account
Model建構
格式我沒有建構Model我用了系統自帶的Model，直接登陸127.0.0.1:8000/admin，為自己新增了一個user用來測試，so easy。賬戶名和密碼自定
model模型建構好了，但是前端頁面的表單模型還沒建立好，在/account/form.py中修改表單配置
from django import forms
class LoginForm(forms.Form):
username = forms.CharField()
password = forms.CharField(widget=forms.PasswordInput)
建立好這個表單模型之後，就可以建構視圖函數了
視圖函數建構
視圖函數這裡就比較複雜了，複雜的原因在于我想讓同一個網址來處理get和post請求，在前端發來GET請求時，傳回登入界面窗體；若前端發來POST請求，則是處理表單資訊，完成登入功能。（session）
在這裡使用者驗證我是用了django自帶的django.contrib.auth.authenticate方法以及login方法自動驗證登入。
完整的account/views.py如下,需要備注的部分我會寫注釋：
from django.shortcuts import render, redirect
from django.http import HttpResponse
from django.contrib.auth import authenticate, login
#導入LoginForm，剛才編寫的form表單，SignUpForm先不管
from .forms import LoginForm, SignUpForm
# Create your views here.
def user_login(request):
if request.method == 'GET':
# 自動生成表單
login_form = LoginForm()
context = {}
#把表單寫入參數并回傳給前端模闆
context['form'] = login_form
return render(request, "account/login.html", context=context)
if request.method == 'POST':
#用POST請求來初始化表單
login_form = LoginForm(request.POST)
# 判斷使用者輸入是否合法
if login_form.is_valid():
# 用鍵值對存儲了表單中的資料，cleaned_data是一個方法，可以擷取鍵值對
data = login_form.cleaned_data
#直接用authenticate方法驗證使用者名和密碼是否正确
user = authenticate(username=data['username'], password=data['password'])
#如果驗證成功
if user:
#django自帶的登陸函數
login(request, user)
#設定session
request.session['username'] = data['username']
#登入成功後跳轉回首頁面
return redirect('/')
else:
return HttpResponse('賬号或密碼錯誤')
else:
return HttpResponse('登入内容有誤')
在這裡有一個要注意的地方，就是session的設定，我們都知道session其實是一個另類的cookie，它目的是讓伺服器能夠識别用戶端，django預設的session時間很長，需要我們手動改為浏覽器關閉則删除session
設定settings.py，增加如下代碼
這樣就OK了，可以繼續寫前端界面
登陸的前端模闆
前端模闆沒啥好介紹的，都是用的bootstrap架構直接搭建的，再利用{{form.屬性}}生成一些表單即可。
{% extends "base_cn.html" %}
{% load staticfiles %}
{% block title %}
歡迎登陸
{% endblock %}
{% block content %}
<div class="row text-center vertical-middle-sm">
<h1>登入界面(采用Django)内置方法</h1>
{% if form.errors %}
<p style="color: red;">賬号或密碼錯誤,請重試!</p>
{% endif %}
<p>請輸入賬号和密碼</p>
<form class="form-horizontal" action="{% url 'user_login' %}" method="POST">{% csrf_token %}
<div class="form-group">
<label for="{{form.username.id_for_label}}" class="col-md-5 control-label" style="color: red;">
<span class="glyphicon glyphicon-user"></span> 使用者名:
</label>
<div class="col-md-6 text-left">{{form.username}}</div>
</div>
<div class="form-group">
<label for="{{form.password.id_for_label}}" class="col-md-5 control-label" style="color: red;">
<span class="glyphicon glyphicon-floppy-open"></span> 密 碼:
</label>
<div class="col-md-6 text-left">{{form.password}}</div>
</div>
<input type="submit" class="btn btn-primary btn-lg" value="登 錄">
</form>
</div>
{% endblock %}
登入成功後修改導航欄内容
完成了登入功能。
但是這是不完善的，我們平時進一個網站，如果登陸成功，頂部導航欄都會更改為“歡迎您，XX”,再點退出則回複原樣，這個其實非常簡單，修改前端模闆即可
名稱為templates/header_cn.html
代碼如下,重點看53行以後的代碼
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="http://www.wangxiong.club"><span
class="glyphicon glyphicon-cloud"></span> 天雄</a>
</div>
<!-- 左側導覽列 -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="/">首頁</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">我的應用<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">爬取翔雲系統</a></li>
<li><a href="#">爬取京東</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">FTP</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">機器學習項目</a></li>
</ul>
</li>
</ul>
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">部落格分類<span class="caret"></span></a>
<ul class="dropdown-menu">
{% for category in categories %}
<li><a href="/category/{{category.id}}">{{category.name}}</a></li>
{% endfor %}
</ul>
</li>
<li><a href="/blog">我的部落格</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">語言<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="en">English</a></li>
<li><a href="">簡體中文</a></li>
</ul>
</li>
</ul>
<!-- 右側導覽列 -->
<ul class="nav navbar-nav navbar-right">
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="搜尋内容">
</div>
<button type="submit" class="btn btn-default">搜尋</button>
</form>
{% if user.is_authenticated %}
<li><a href="#">歡迎您,{{user.username}}</a></li>
<li><a href="/account/logout">登出</a></li>
{% else %}
<li><a href="/account/signup">注冊</a></li>
<li><a href="/account/login">登入</a></li>
{% endif %}
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
總結
部落格的登入其實很簡單，後備隻是就是要掌握session、cookie的原理。
![TestLink導出用例轉換工具(XML2Excel)[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)