Flask學習之三 web表單

標籤：

本部分Miguel Grinberg教程的翻譯地址：http://www.pythondoc.com/flask-mega-tutorial/webforms.html

開源中國的：http://www.oschina.net/translate/the-flask-mega-tutorial-part-iii-web-forms

英文原文地址：http://blog.miguelgrinberg.com/post/the-flask-mega-tutorial-part-iii-web-forms

PS.建議英語比較好直接看英文部落格，因為中文翻譯可能會有問題，而且有問題英文部落格那邊會進行修改，但是中文翻譯是不會再修改的。

 

關於表單：Web 表單是在任何一個 web 應用程式中最基本的一部分。我們將使用表單允許使用者寫文章，以及登入到應用程式中。

 

一、配置

教程：為了能夠處理 web 表單，我們將使用 Flask-WTF ，該擴充封裝了 WTForms 並且恰當地整合進 Flask 中。

因為許多 Flask 擴充需要大量的配置，比較方便的做法是在 microblog 檔案夾的根目錄下建立一個設定檔 config.py：

CSRF_ENABLED = True
SECRET_KEY = ‘you-will-never-guess‘

教程：CSRF_ENABLED 配置是為了啟用 跨網站請求偽造 保護。在大多數情況下，你需要啟用該配置使得你的應用程式更安全些。

         SECRET_KEY 配置僅僅當 CSRF 啟用的時候才需要，它是用來建立一個加密的令牌，用於驗證一個表單。當你編寫自己的應用程式的時候，請務必設定很難被猜測到密鑰。

 

在寫好設定檔之後，我們需要告訴Flask如何讀取和使用它。修改app/__init__.py：

from flask import Flaskapp = Flask(__name__)app.config.from_object(‘config‘)from app import views

 

二、使用者登入表單

教程：在 Flask-WTF 中，表單是表示成對象，Form 類的子類。一個表單子類簡單地把表單的域定義成類的變數。

這裡的登入表單不是使用者名稱/密碼類型，而是OpenID。（對於這個東西目前其實我比較的迷茫）

教程：OpenID 登入僅僅需要一個字串，被稱為 OpenID。我們將在表單上提供一個 ‘remember me’ 的選擇框，以至於使用者可以選擇在他們的網頁瀏覽器上種植 cookie ，當他們再次訪問的時候，瀏覽器能夠記住他們的登入。

第一個表單(檔案 app/forms.py):

from flask.ext.wtf import Formfrom wtforms import StringField, BooleanFieldfrom wtforms.validators import DataRequiredclass LoginForm(Form):    openid = StringField(‘openid‘, validators = [DataRequired()])    remember_me = BooleanField(‘remember_me‘, default = False)        

注意：這裡如果看中文翻譯的教程，是沒辦法正常執行的，以上的代碼是英文部落格。

 

 

三、表單範本

就是html布局，代碼如下(檔案 app/templates/login.html):

<!-- extend from base layout -->{% extends "base.html" %}{% block content %}<h1>Sign In</h1><form action="" method="post" name="login">    {{form.hidden_tag()}}    <p>        Please enter your OpenID:<br>        {{form.openid(size=80)}}<br>    </p>    <p>{{form.remember_me}} Remember Me</p>    <p><input type="submit" value="Sign In"></p></form>{% endblock %}

在我們所有模板中，都應該繼承base.html，用以保證布局的一致性。

教程：模板期望一個執行個體化自我們剛才建立地表單類的表單對象儲存成一個模板參數，稱為 form。當我們編寫渲染這個模板的視圖函數的時候，我們將會特別注意傳送這個模板參數到模板中。

form.hidden_tag() 模板參數將被替換為一個隱藏欄位，用來是實現在配置中啟用的 CSRF 保護。如果你已經啟用了 CSRF，這個欄位需要出現在你所有的表單中。

我們表單中實際的欄位也將會被表單對象渲染，你只必須在欄位應該被插入的地方指明一個 {{form.field_name}} 模板參數。某些欄位是可以帶參數的。在我們的例子中，我們要求表單產生一個 80 個字元寬度的 openid 欄位。

因為我們並沒有在表單中定義提交按鈕，我們必須按照普通的欄位來定義。提交欄位實際並不攜帶資料因此沒有必要在表單類中定義。

 

四、表單視圖

要在瀏覽器看到登入頁面，還需要一個有登入頁面的表單視圖。修改(檔案 app/views.py):

from flask import render_template, flash, redirectfrom app import appfrom forms import LoginForm# index view function suppressed for brevity@app.route(‘/login‘, methods = [‘GET‘, ‘POST‘])def login():    form = LoginForm()    return render_template(‘login.html‘,        title = ‘Sign In‘,        form = form)

上面的代碼做了一件事就是在路由裝飾器中添加一個新方法。讓 Flask 明白我們這個視圖函數支援 GET 和 POST 請求。否則這個視圖函數只會響應 GET 請求。我們需要得到使用者填寫表單後提交的資料，這些資料是從 POST 請求中傳遞過來的。 

可以登入URL http://127.0.0.1:5000/login 看看效果。現在還沒寫接收資料，所以怎麼按提交按鈕都是不會有效果的。

注意：以上是新修改的部分，可以不刪除而在下面進行增加的，如下：

from app import appfrom flask import render_template, flash, redirectfrom forms import LoginForm@app.route(‘/‘)@app.route(‘/index‘)def index():    user = { ‘nickname‘: ‘Miguel‘} # fake user    return render_template("index.html",        title = ‘Home‘,        user = user)@app.route(‘/login‘, methods=[‘GET‘, ‘POST‘])def login():    form = LoginForm()    return render_template(‘login.html‘,        title = ‘Sign In‘,        form = form)

這樣http://127.0.0.1:5000這個URL才能繼續使用，否則就只能用 http://127.0.0.1:5000/login 這個URL。只用部落格中的代碼http://127.0.0.1:5000這個URL就會變成404 NOT FOUND

 

Flask學習之三 web表單