[TOC] 數據模型和前端頁面我們都已經設計好了，是時候開始完善我們的登錄視圖具體內容了。 <br /> ## **一、登錄視圖** 根據我們在路由中的設計，用戶通過`login.html`中的表單填寫用戶名和密碼，并以POST的方式發送到服務器的`/login/`地址。服務器通過`login/views.py`中的`login()`視圖函數，接收并處理這一請求。 我們可以通過下面的方法接收和處理請求： ~~~ def login(request): if request.method == "POST": username = request.POST.get('username') password = request.POST.get('password') print(username, password) return redirect('/index/') return render(request, 'login/login.html') ~~~ 說明： * 每個視圖函數都至少接收一個參數，并且是第一位置參數，該參數封裝了當前請求的所有數據； * 通常將第一參數命名為request，當然也可以是別的； * `request.method`中封裝了數據請求的方法，如果是“POST”（全大寫），將執行if語句的內容，如果不是，直接返回最后的render()結果，也就是正常的登錄頁面； * `request.POST`封裝了所有POST請求中的數據，這是一個字典類型，可以通過get方法獲取具體的值。 * 類似`get('username')`中的鍵‘username’是HTML模板中表單的input元素里‘name’屬性定義的值。所以在編寫form表單的時候一定不能忘記添加name屬性。 * 利用print函數在開發環境中驗證數據； * 利用redirect方法，將頁面重定向到index頁。 <br /> 啟動服務器，然后在`http://127.0.0.1:8000/login/`的表單中隨便填入用戶名和密碼，然后點擊提交。然而，頁面卻出現了錯誤提示，如下圖所示：  <br /> 錯誤原因是CSRF驗證失敗，請求被中斷。CSRF（Cross-site request forgery）跨站請求偽造，是一種常見的網絡攻擊手段，具體原理和技術內容請自行百科。Django自帶對許多常見攻擊手段的防御機制，CSRF就是其中一種，還有XSS、SQL注入等。 <br /> 解決這個問題的辦法其實在Django的Debug錯誤頁面已經給出了，我們需要在前端頁面的form表單內添加一個`{% csrf_token %}`標簽： ~~~ <form class="form-login" action="/login/" method="post"> {% csrf_token %} <h3 class="text-center">歡迎登錄</h3> <div class="form-group"> <label for="id_username">用戶名：</label> <input type="text" name='username' class="form-control" id="id_username" placeholder="Username" autofocus required> </div> <div class="form-group"> <label for="id_password">密碼：</label> <input type="password" name='password' class="form-control" id="id_password" placeholder="Password" required> </div> <div> <a href="/register/" class="text-success " ><ins>新用戶注冊</ins></a> <button type="submit" class="btn btn-primary float-right">登錄</button> </div> </form> ~~~ 這個標簽必須放在form表單內部，但是內部的位置可以隨意。 重新刷新login頁面，確保csrf的標簽生效，然后再次輸入內容并提交。這次就可以成功地在Pycharm開發環境中看到接收的用戶名和密碼，同時瀏覽器頁面也跳轉到了首頁。 <br /> ## **二、數據驗證** 前面我們提到過，要對用戶發送的數據進行驗證。數據驗證分前端頁面驗證和后臺服務器驗證。前端驗證可以通過專門的插件或者自己寫JS代碼實現，也可以簡單地使用HTML5的新特性。這里，我們使用的是HTML5的內置驗證功能，如下圖所示：  它幫我們實現了下面的功能： * 用戶名和密碼這類必填字段不能為空 * 密碼部分用圓點替代 如果你還想要更強大和豐富的驗證功能，比如限定密碼長度不低于8位，用戶名不能包含特殊字符等等，可以搜索并使用一些插件。 <br /> 前端頁面的驗證都是用來給守法用戶做提示和限制的，并不能保證絕對的安全，后端服務器依然要重新對數據進行驗證。我們現在的視圖函數，沒有對數據進行任何的驗證，如果你在用戶名處輸入個空格，是可以正常提交的，但這顯然是不允許的。甚至，如果跳過瀏覽器偽造請求，那么用戶名是None也可以發送過來。通常，除了數據內容本身，我們至少需要保證各項內容都提供了且不為空，對于用戶名、郵箱、地址等內容往往還需要剪去前后的空白，防止用戶未注意到的空格。 <br /> 現在，讓我們修改一下前面的代碼： ~~~ def login(request): if request.method == "POST": username = request.POST.get('username') password = request.POST.get('password') if username.strip() and password: # 確保用戶名和密碼都不為空 # 用戶名字符合法性驗證 # 密碼長度驗證 # 更多的其它驗證..... return redirect('/index/') return render(request, 'login/login.html') ~~~ * get方法是Python字典類型的內置方法，它能夠保證在沒有指定鍵的情況下，返回一個None，從而確保當數據請求中沒有username或password鍵時不會拋出異常； * 通過`if username and password:`確保用戶名和密碼都不為空； * 通過strip方法，將用戶名前后無效的空格剪除； * 更多的數據驗證需要根據實際情況增加，原則是以最低的信任度對待發送過來的數據。 <br /> ## **三、驗證用戶名和密碼** 數據形式合法性驗證通過了，不代表用戶就可以登錄了，因為最基本的密碼對比還未進行。 <br /> 通過唯一的用戶名，使用Django的ORM去數據庫中查詢用戶數據，如果有匹配項，則進行密碼對比，如果沒有匹配項，說明用戶名不存在。如果密碼對比錯誤，說明密碼不正確。 <br /> 下面貼出當前狀態下，/login/views.py中的全部代碼，注意其中添加了一句`from . import models`，導入我們先前編寫好的model模型。 ~~~ from django.shortcuts import render from django.shortcuts import redirect from . import models # Create your views here. def index(request): pass return render(request, 'login/index.html') def login(request): if request.method == "POST": username = request.POST.get('username') password = request.POST.get('password') if username.strip() and password: # 確保用戶名和密碼都不為空 # 用戶名字符合法性驗證 # 密碼長度驗證 # 更多的其它驗證..... try: user = models.User.objects.get(name=username) except: return render(request, 'login/login.html') if user.password == password: return redirect('/index/') return render(request, 'login/login.html') def register(request): pass return render(request, 'login/register.html') def logout(request): pass return redirect("/login/") ~~~ 說明： * 首先要在頂部導入models模塊； * 使用try異常機制，防止數據庫查詢失敗的異常； * 如果未匹配到用戶，則執行except中的語句；注意這里沒有區分異常的類型，因為在數據庫訪問過程中，可能發生很多種類型的異常，我們要對用戶屏蔽這些信息，不可以暴露給用戶，而是統一返回一個錯誤提示，比如用戶名不存在。這是大多數情況下的通用做法。當然，如果你非要細分，也不是不行。 * `models.User.objects.get(name=username)`是Django提供的最常用的數據查詢API，具體含義和用法可以閱讀前面的章節，不再贅述； * 通過`user.password == password`進行密碼比對，成功則跳轉到index頁面，失敗則返回登錄頁面。 重啟服務器，然后在登錄表單內，使用錯誤的用戶名和密碼，以及我們先前在admin中創建的合法的測試用戶，分別登錄，看看效果。 <br /> ## **四、 添加提示信息** 上面的代碼還缺少很重要的一部分內容，也就是錯誤提示信息！無論是登錄成功還是失敗，用戶都沒有得到任何提示信息，這顯然是不行的。 <br /> 修改一下login視圖： ~~~ def login(request): if request.method == 'POST': username = request.POST.get('username') password = request.POST.get('password') message = '請檢查填寫的內容！' if username.strip() and password: # 用戶名字符合法性驗證 # 密碼長度驗證 # 更多的其它驗證..... try: user = models.User.objects.get(name=username) except : message = '用戶不存在！' return render(request, 'login/login.html', {'message': message}) if user.password == password: print(username, password) return redirect('/index/') else: message = '密碼不正確！' return render(request, 'login/login.html', {'message': message}) else: return render(request, 'login/login.html', {'message': message}) return render(request, 'login/login.html') ~~~ 請仔細分析一下上面的登錄和密碼驗證邏輯，以及錯誤提示的安排。 <br /> 這里增加了message變量，用于保存提示信息。當有錯誤信息的時候，將錯誤信息打包成一個字典，然后作為第三個參數提供給render方法。這個數據字典在渲染模板的時候會傳遞到模板里供你調用。 <br /> 為了在前端頁面顯示信息，還需要對`login.html`進行修改： ~~~ <form class="form-login" action="/login/" method="post"> {% if message %} <div class="alert alert-warning">{{ message }}</div> {% endif %} {% csrf_token %} <h3 class="text-center">歡迎登錄</h3> <div class="form-group"> <label for="id_username">用戶名：</label> <input type="text" name='username' class="form-control" id="id_username" placeholder="Username" autofocus required> </div> <div class="form-group"> <label for="id_password">密碼：</label> <input type="password" name='password' class="form-control" id="id_password" placeholder="Password" required> </div> <div> <a href="/register/" class="text-success " ><ins>新用戶注冊</ins></a> <button type="submit" class="btn btn-primary float-right">登錄</button> </div> </form> ~~~ Django的模板語言`{% if xxx %}{% endif %}`非常類似Python的if語句，也可以添加`{% else %}`分句。例子中，通過判斷message變量是否為空，也就是是否有錯誤提示信息，如果有，就顯示出來！這里使用了Bootstrap的警示信息類alert，你也可以自定義CSS或者JS。 <br /> 好了，重啟服務器，嘗試用錯誤的和正確的用戶名及密碼登錄，看看頁面效果吧！下面是錯誤信息的展示：