使用Flask-Avatars在Flask項目裏設置頭像

這篇文章屬於「Flask經常使用擴展介紹系列」，這個系列的文章目錄索引能夠在《Flask經常使用擴展介紹系列文章索引》看到。

Flask-Avatars

大多數Web程序中都會涉及到頭像的實現。不一樣類型的項目，對於頭像的需求不一樣，有些項目能夠直接使用Gravatar提供的頭像服務，而有的項目則須要提供自定義頭像功能。擴展Flask-Avatars幾乎知足了全部常見的頭像需求：

• 默認頭像
• Gravatar頭像
• Robohash頭像
• 社交網站頭像
• 生成隨機圖案頭像Identicon
• 圖片裁剪頭像

GitHub主頁：github.com/greyli/flas…

安裝與初始化

使用pip安裝：

$ pip install flask-avatars複製代碼

像其餘擴展相似，你須要實例化從flask_avatars導入的Avatars類，並傳入app實例：

from flask_avatars import Avatars

app = Flask(__name__)
avatars = Avatars(app)複製代碼

若是你使用工廠函數建立程序實例，那麼這裏也能夠不傳入程序實例app，在工廠函數中對這個avatars對象調用init_app()方法時再傳入app實例。

默認頭像

Flask-Avatars內置了幾個默認頭像，能夠用來做爲用戶註冊後的初始頭像，或是做爲博客評論者的頭像。在模板中調用avatars.default()便可獲取URL：

<img src="{{ avatars.default() }}">複製代碼

你能夠經過size參數來設置尺寸，默認爲m，其餘可選值有l和s。實際的調用示例以下所示：

Gravatar

在模板中調用avatars.gravatar()方法並傳入Email散列值便可獲取Gravatar（gravatar.com）的頭像URL：

<img src="{{ avatars.gravatar(email_hash) }}">複製代碼

Email散列值能夠經過下面的方式獲取：

import hashlib

avatar_hash = hashlib.md5(my_email.lower().encode('utf-8')).hexdigest()複製代碼

實際的調用示例以下所示：

Robohash

Robohash（robohash.org）是一個生成隨機機器人頭像的服務（目前Gravatar的默認頭像中已經支持這一類型，能夠經過將default參數設爲robohash獲取）。在模板中調用avatars.robohash()並傳入隨機文本做爲參數便可獲取Robohash的頭像URL：

<img src="{{ avatars.robohash(some_text) }}">複製代碼

實際的調用示例以下所示：

社交網站頭像

Flask-Avatars經過Avatars.io提供了社交頭像獲取服務，目前支持Facebook、Twitter、Instagram和Gravatar。經過在模板中調用avatars.social_media()方法並傳入用戶名（username）便可獲取對應的頭像URL，經過size參數能夠設置尺寸，可選值爲small、medium和large：

<img src="{{ avatars.social_media(username) }}">複製代碼

經過platform參數能夠設置平臺，默認爲twitter，可選值爲twitter、facebook、instagram和gravatar：

<img src="{{ avatars.social_media(username, platform='facebook') }}">複製代碼

實際的調用示例以下所示：

生成隨機圖案頭像Identicon

Gravatar服務可能會有不穩定的狀況，這種狀況下，你能夠在本地爲用戶生成頭像（identicon），下面是一個簡單的示例：

app.config['AVATARS_SAVE_PATH '] = 'the/path/to/save/avatar'

avatar = Identicon()
filenames = avatar.generate(text=‘一串惟一字符’)複製代碼

avatar.generate()會根據傳入的隨機字符建立三個尺寸（能夠經過配置變量AVATARS_SIZE_TUPLE自定義）的頭像，保存到指定的位置，並返回三個頭像文件名。你能夠將這個文件名保存到數據庫中，並建立一個視圖函數來提供頭像文件：

from flask import send_form_directory, current_app

@app.route('/avatars/<path:filename>')
def get_avatar(filename):
    return send_from_directory(current_app.config['AVATARS_SAVE_PATH'], filename)複製代碼

實際生成的頭像示例以下所示：

裁剪頭像

Flask-Avatars基於Jcrop提供了頭像裁剪功能，具體步驟能夠參考文檔中的相關部分。下面是示例程序中的裁剪頁面：

裁剪後的結果：

配置

Flask-Avatars支持的配置列表以下所示：

配置	默認值	說明
AVATARS_GRAVATAR_DEFAULT	identicon	Gravatar默認頭像類型
AVATARS_SAVE_PATH	None	頭像保存路徑
AVATARS_SIZE_TUPLE	(30, 60, 150)	頭像尺寸三元素元組，格式爲 (small, medium, large)，用於生成identicon頭像和裁剪頭像
AVATARS_IDENTICON_COLS	7	Identicon頭像一行的色塊數量
AVATARS_IDENTICON_ROWS	7	Identicon頭像一列的色塊數量
AVATARS_IDENTICON_BG	None	Identicaon頭像的背景顏色，傳入RGB元組，好比(125, 125, 125)。默認使用隨機顏色
AVATARS_CROP_BASE_WIDTH	500	裁剪圖片的顯示寬度
AVATARS_CROP_INIT_POS	(0, 0)	裁剪框起始位置，兩元素元組(x, y)，默認爲左上角
AVATARS_CROP_INIT_SIZE	None	裁剪框的尺寸，默認爲尺寸元組中設置的l尺寸大小，即AVATARS_SIZE_TUPLE[0]
AVATARS_CROP_MIN_SIZE	None	裁剪框的限制最小尺寸，默認無限制
AVATARS_CROP_PREVIEW_SIZE	None	預覽窗口的尺寸，默認爲尺寸元組中設置的m尺寸大小，即AVATARS_SIZE_TUPLE[1]
AVATARS_SERVE_LOCAL	False	是否從本地加載Jcrop資源，默認從CDN加載

示例程序

Flask-Avatars的Git倉庫中包含三個實例程序，也就是文中的截圖對應的程序：

• examples/basic —— 基本示例
• examples/identicon —— Identicon示例
• examples/crop —— 裁剪示例

你能夠經過下面的方式來運行實例程序：

$ git clone https://github.com/greyli/flask-avatars.git
$ cd flask-avatars/examples
$ pip install flask flask-avatars
$ cd basic  # 切換到identicon和crop目錄能夠運行對應的示例程序
$ flask run複製代碼

相關連接

• GitHub主頁：github.com/greyli/flas…
• Flask經常使用擴展介紹系列文章索引：zhuanlan.zhihu.com/p/39183712
• Gravatar頭像API：en.gravatar.com/site/implem…