基於Flask框架搭建視訊網站的學習日誌（三）之原始web表單
基於Flask框架搭建視訊網站的學習日誌（三）1.原始Web 表單
本節主要用於體驗一下前端後端直接資料的互動，樣例不是太完善，下一節會加入Flash處理，稍微完善一下頁面
（備註：建議先閱讀廖雪峰老師的部落格，MVC：Model-View-Controller，中文名“模型-檢視-控制器”）
負責HTML頁面資料採集，通過表單將使用者輸入的資料提交給伺服器。（Flask-WTF擴充套件封裝了WTForms，並且有驗證表單資料的功能，這樣就可以少寫很多驗證輸入資料的程式碼，比如判斷兩次輸入的密碼是否相同等等）
本節先探究最原始的web表單如何實現，下節在使用WTF
一、首先，在HTML頁面中直接寫form表單：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <form method="post"> <label>Username:</label> <input type = "text" name="username"> <br> <label>Password:</label> <input type = "password" name="password"> <br> <label>Make_sure:</label> <input type = "password" name="password2"> <br> <input type="submit" value="submit"> <br> </form> </body> </html>補充一些html知識：
<br>表示換行；<hr>表示加一條分割線；由於name定義的是文字的名字，所以password和password2要區分開來，這在檢視函式中的request.form.get(‘name’)裡面的name要用到，這也就是MVC中的Model
二、檢視函式中獲取表單資料
明確目的：實現一個簡單的登入的邏輯處理
1、由於路由需要有get和post兩種請求方式，所以我們應該在程式碼中判斷請求方式（from flask import request）
2、獲取請求的引數，從表單中拿到資料
3、判斷引數是否填寫，密碼是否輸入
4、如果判斷都ok，就返回success
from flask import Flask, render_template, request
app = Flask(__name__)
@app.route('/', methods=['GET', 'POST']) #由於路由需要有get和post兩種請求方式
def _hello():
#1.判斷請求方式，用request.method
if request.method == 'POST':
#2.獲取請求的引數，用request.form.get()
username = request.form.get('username')
password = request.form.get('password')
password2 = request.form.get('password2')
print ('success')
#3.判斷引數是否填寫，密碼是否輸入
if not all([username, password, password2]):
print("引數不完整")
elif password != password2:
print("密碼不一致")
#4.如果判斷都ok，就返回success
else :
return 'success'
return render_template('hello.html')
if __name__ == '__main__':
app.run(debug=True)HTML補充知識：
HTML 表單
表單是一個包含表單元素的區域。
表單元素是允許使用者在表單中輸入內容,比如：文字域(textarea)、下拉列表、單選框(radio-buttons)、複選框(checkboxes)等等。
表單使用表單標籤
來設定:<form>
.
*input 元素*
.
</form><form>裡面的就是整個表單 ，<input>是輸入標籤，type定義輸入文字型別，name定義輸入文字的名字；
> > 文字域（Text Fields）
文字域通過
<input type="text">標籤來設定，當用戶要在表單中鍵入字母、數字等內容時，就會用到文字域。
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>First name:瀏覽器顯示如下：
Last name:
注意:表單本身並不可見。同時，在大多數瀏覽器中，文字域的預設寬度是 20 個字元。
>>密碼欄位
密碼欄位通過標籤
<input type="password">來定義:
<form>
Password: <input type="password" name="pwd">
</form>瀏覽器顯示效果如下:
Password:
注意:密碼欄位字元不會明文顯示，而是以星號或圓點替代。