Flask 是一種很贊的Python web架構。它極小，簡單，最棒的是它很容易學。
今天我來帶你搭建你的第一個Flask web應用！和官方教程 一樣，你将搭建你自己的微部落格系統：Flaskr。和官方Flask教程不同的是——我們通過使用Stormpath來建立并管理使用者賬戶和資料，你的工作效率會更高。開發程序會顯著地加快！
我們這就開始吧。
注意：這篇教程面向Flask開發新人，幫助他們了解如何使用Flask和Stormpath建立一個簡單的網站。本文是Flask官方教程的改版。
目标
Flaskr 應用的目标很簡單：
- 允許使用者以事先生成的賬戶（使用Stormpath儲存）登入、登出本微部落格系統。
- 允許登入使用者在頁面添加包含了純文字和一些HTML body文本的條目。使用者被認為是可信任的，HTML内容不會被審查。
- 以時間順序（新的在最上）在網站首頁顯示所有部落格條目。
最終的網站應該看起來像這樣：
準備
開始之前，我們需要先安裝一些Python包才能幹活！我們通過?Python包管理器pip來完成這件事。
$ pip install flask flask-stormpath
上述指令會安裝兩個包：Flask, 和Flask-Stormpath，這兩個包在整篇教程都會用到。
接着，你需要建立一個Stormpath賬戶。你可以在Stormpath網站注冊：https://api.stormpath.com/register
當你建立了一個Stormpath賬戶并登入後，你還需要建立一個API 密鑰。你可以在操作頁面上點選建立API密鑰按鈕來完成：https://api.stormpath.com/ui/dashboard
建立了API密鑰後，你會被提示要去下載下傳一個名為apiKey.properties的檔案，稍後我們将用到它。
注意：不要把apiKey.properties檔案檢入你的版本控制系統（如果你在用的話）！這個檔案存儲着你的Stormpath證書，應該被妥善保管。
接着，你會想要建立新的Stormpath應用，請通路應用網頁：https://api.stormpath.com/v#!applications，點選注冊應用。建立一個名為flaskr的新應用，選項按預設的來。
最後，通路賬戶頁面：https://api.stormpath.com/ui/accounts/create ，在flaskr Directory建立新使用者賬戶。所有在這兒建立的賬戶都可以用來登入你将搭建的微部落格。
目錄結構
你要做的第一件事就是建立一個存放你應用代碼的目錄結構。你需要建立若幹目錄，然後把你的apiKey.properites?放到建立的項目目錄：
$ mkdir -p flaskr/{static,templates}; cp ~/path/to/apiKey.properties flaskr/
$ tree flaskr
flaskr
├── apiKey.properties
├── static
└── templates
2 directories, 1 file
flaskr目錄将是你應用的根目錄。static目錄用于存放你的靜态檔案（css，javascript, 和圖像檔案）.templates目錄用于存放你的Jinja模闆（用于渲染HTML）。
安裝應用
現在你的目錄結構搭好了，我們開始配置應用了！
首先，在你flaskr目錄下建立名為flaskr.py的新檔案。你的應用代碼放在這個檔案裡。
一切将從這裡開始：
from datetime import datetime
from flask import (
Flask,
abort,
flash,
redirect,
render_template,
request,
url_for,
)
from flask.ext.stormpath import (
StormpathError,
StormpathManager,
User,
login_required,
login_user,
logout_user,
user,
)
app = Flask(__name__)
app.config['DEBUG'] = True
app.config['SECRET_KEY'] = 'some_really_long_random_string_here'
app.config['STORMPATH_API_KEY_FILE'] = 'apiKey.properties'
app.config['STORMPATH_APPLICATION'] = 'flaskr'
stormpath_manager = StormpathManager(app)
if __name__ == '__main__':
app.run()
需要關注的：
- 在flaskr.py檔案的開頭你導入了若幹庫——下面整篇教程都會用到它們
- -你建立了一個app對象——這是每個Flask 項目的核心
- 你在app.config裡添加了若幹配置變量。app.config是一個Python字典變量，你可以用它存放你想存放的任何定制配置。這裡我們設定了若幹後面會用到的重要的變量：
- DEBUG 變量可以設定為True或者False。它用于控制Flask的内置錯誤報告行為（開發模式下它讓Flask可以顯示詳細的錯誤資訊）
- SECRET_KEY 變量在内部使用，用來保證用戶端的會話安全。當部署一個真正的Flask應用時，要確定這是一個較長的随機生成的字元串。
- STORMPATH_API_KEY_FILE? 變量應該指向你的apiKey.properties 檔案位置。更多資訊參見：http://flask- stormpath.readthedocs.org/en/latest/setup.html
- STORMPATH_APPLICATION 變量應該是你之前建立的Stormpath 應用名。
- 你建立了一個stormpath_manager 對象，它用于控制Stormpath 庫，後面将幫你輕松與使用者以及使用者資料進行互動。
- 在最後你調用了app.run()。它告訴Flask以開發模式運作你的網站以便于測試。
運作下述指令之後，你就可以看到你的Flask應用開始在端口5000運作：
$ python flaskr.py
* Running on http://127.0.0.1:5000/
* Restarting with reloader
不過當你通路http://127.0.0.1:5000， 你會看到一個404 not found 資訊。這是因為你還沒有定義任何視圖或者URL路由 。
視圖
現在安裝的部分你已經做完了，我們來定義視圖。下面的代碼應該放在flaskr.py 檔案中，在這個上面：
if __name__ == ‘__main__':
app.run()
代碼如下：
@app.route('/')
def show_posts():
posts = []
for account in stormpath_manager.application.accounts:
if account.custom_data.get('posts'):
posts.extend(account.custom_data['posts'])
posts = sorted(posts, key=lambda k: k['date'], reverse=True)
return render_template('show_posts.html', posts=posts)
@app.route('/add', methods=['POST'])
@login_required
def add_post():
if not user.custom_data.get('posts'):
user.custom_data['posts'] = []
user.custom_data['posts'].append({
'date': datetime.utcnow().isoformat(),
'title': request.form['title'],
'text': request.form['text'],
})
user.save()
flash('New post successfully added.')
return redirect(url_for('show_posts'))
@app.route('/login', methods=['GET', 'POST'])
def login():
error = None
if request.method == 'POST':
try:
_user = User.from_login(
request.form['email'],
request.form['password'],
)
login_user(_user, remember=True)
flash('You were logged in.')
return redirect(url_for('show_posts'))
except StormpathError, err:
error = err.message
return render_template('login.html', error=error)
@app.route('/logout')
def logout():
logout_user()
flash('You were logged out.')
return redirect(url_for('show_posts'))
我們來讨論一下上面的代碼。
你可能注意到首先定義的函數是show_posts。這個函數用于在網站前端頁面顯示釋出的博文。如你可能已經猜到的，裝飾器@app.route(‘/’)告訴Flask如何運作這個函數。
每次使用者請求 URL “/”，Flask就會運作show_posts，把輸出傳回給使用者。
show_posts 就隻是：
- 疊代所有的使用者賬戶，查找博文。每篇博文就是一個簡單的如下格式的Python字典：
{
'date': '2014-04-01T22:50:49.762475',
'text': 'Blog content.',
'title': 'Post title'
}
- 每找到一篇博文就添加到posts數組。
- 按日期對posts數組排序，是以新釋出的在前面。
- 以posts數組作為輸入，渲染出一個叫做show_posts.html的HTML模闆.
add_posts 視圖用于登入使用者向網站釋出新博文。這個視圖帶來下面幾樣東西：
- 裝飾器@app.route(‘/add’, methods=[‘POST’])告訴Flask該URL隻接受POST請求。Flask預設隻接受GET請求。
- @login_required 裝飾器確定能通路該視圖前使用者已經登入。如果使用者沒有登入而嘗試對該視圖POST，會得到HTTP 401 未授權應答。
- 任何裝飾了?@login_required的視圖都可以通路user變量。這是一個存放了使用者賬戶細節的對象。
它的工作機制很簡單：
- 檢查使用者賬戶下是否有儲存的博文。這一步是通過檢查user.custom_data.get(‘posts’) 不是False來實作的。user.custom_data是一個Python字典，你可以在其中儲存任何想儲存的使用者資料。
- 從POST 請求中抓取标題和正文，在使用者的posts數組中建立一個新的post對象。
- 儲存新博文到使用者賬戶的Stormpath中。
- 發出一個後面會向使用者展示的消息。
- 最後，把使用者重定向到show_posts?視圖，讓新添加的博文可以展現出來。
- login 和logout視圖特别地簡單。
login視圖就是簡單地從使用者POST請求中提取電子郵件位址和密碼，然後從Stormpath抓取user對象，嘗試登入，并建立一個本地會話。
logout視圖就是銷毀使用者會話。
模闆
下一樣要加入的東西就是模闆代碼。Flask使用Jinja模闆語言，它讓編寫HTML模闆變得非常簡單。
讓我們定義一個布局模闆templates/layout.html作為開始。後面我們寫的其他模闆都将從這個基礎模闆而來。這個政策很有用，因為它允許你在一個地方定義會被多次引用的模闆代碼。
把下面的代碼添加到你的layout.html模闆檔案：
<!doctype html>
<head>
<title>Flaskr</title>
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='style.css') }}">
</head>
<body>
<div class=page>
<h1>Flaskr</h1>
<div class=metanav>
{% if user.email %}
<a href="{{ url_for('logout') }}">log out</a>
{% else %}
<a href="{{ url_for('login') }}">log in</a>
{% endif %}
</div>
{% for message in get_flashed_messages() %}
<div class=flash>{{ message }}</div>
{% endfor %}
{% block body %}{% endblock %}
</div>
</body>
接着是templates/show_posts.html 模闆檔案：
{% extends "layout.html" %}
{% block body %}
{% if user.email %}
<form action="{{ url_for('add_post') }}" method=post class=add-entry>
<dl>
<dt>Title:
<dd><input type=text size=30 name=title>
<dt>Text:
<dd><textarea name=text rows=5 cols=40></textarea>
<dd><input type=submit value=Share>
</dl>
</form>
{% endif %}
<ul class=entries>
{% for post in posts %}
<li><h2>{{ post['title'] }}</h2>{{ post['text']|safe }}
{% else %}
<li><em>Unbelievable. No posts here so far!</em>
{% endfor %}
</ul>
{% endblock %}
最後，是templates/login.html 模闆檔案：
{% extends "layout.html" %}
{% block body %}
<h2>Login</h2>
{% if error %}<p class=error><strong>Error:</strong> {{ error }}{% endif %}
<form action="{{ url_for('login') }}" method=post>
<dl>
<dt>Email:
<dd><input type=text name=email>
<dt>Password:
<dd><input type=password name=password>
<dd><input type=submit value=Login>
</dl>
</form>
{% endblock %}
首先要注意的是?layout.html模闆定義了一個body塊，在任何子模闆中它都可以被同名的塊替代。
layout.html模闆顯示了一個login或者logout模闆，還顯示所有的閃回資訊。
{% if user.email %}
因為你用的是Flask-Stormpath，所有模闆都可以通路一個神奇的user 變量。當一個使用者登入後，該使用者的所有細節都是可見的（是以這個檢查能生效）。
show_posts.html?模闆疊代posts數組，它是被show_posts視圖調用render_template時傳入的。Jinja允許你對任何可以疊代的東西使用for循環。
還有很重要的一點，為了輸出變量内容，你需要在變量外面加上花括号.
{{ variable }}
{{ post['text']|safe }}
既然我們決定了允許使用者在他們的博文中輸入任性的HTML代碼，我們就得使用模闆的safe過濾器來輸出博文中的body塊。
Jinja預設會自動忽略任何特殊字元，是以我們得使用safe過濾器來顯示使用者輸入的HTML和Javascript。
添加樣式
最後一件要做的就是建立一個帶有如下内容的static/style.css 檔案：
body { font-family: sans-serif; background: #eee; }
a, h1, h2 { color: #377ba8; }
h1, h2 { font-family: 'Georgia', serif; margin: 0; }
h1 { border-bottom: 2px solid #eee; }
h2 { font-size: 1.2em; }
.page { margin: 2em auto; width: 35em; border: 5px solid #ccc;
padding: 0.8em; background: white; }
.entries { list-style: none; margin: 0; padding: 0; }
.entries li { margin: 0.8em 1.2em; }
.entries li h2 { margin-left: -1em; }
.add-entry { font-size: 0.9em; border-bottom: 1px solid #ccc; }
.add-entry dl { font-weight: bold; }
.metanav { text-align: right; font-size: 0.8em; padding: 0.3em;
margin-bottom: 1em; background: #fafafa; }
.flash { background: #cee5F5; padding: 0.5em;
border: 1px solid #aacbe2; }
.error { background: #f0d6d6; padding: 0.5em; }
這個檔案會被layout.html 模闆加載，提供得體的顯示風格。
測試它
現在我們完成了應用的編碼，讓我們看看最終的産品吧！
為了運作你炫酷的新網站，你得首先通過如下指令來重新啟動Flask web 伺服器：
$ python flaskr.py
* Running on http://127.0.0.1:5000/
* Restarting with reloader
然後在你的浏覽器通路http://127.0.0.1:5000吧。你現在應該能看到正在運作的flaskr 網站，并能使用Stormpath 賬戶登入，發博文等等。
精選留言
該文章作者已設定需關注才可以留言
寫留言
該文章作者已設定需關注才可以留言
寫留言
加載中
以上留言由公衆号篩選後顯示
了解留言功能詳情
微信掃一掃
關注該公衆号
來自為知筆記(Wiz)