添加 Favicon

“Favicon”是浏览器用于在标签页和书签收藏夹等处显示的图标,它赋予你的站点一个独特的标志并增加其区分度。

一个常见的问题是如何在 Flask 应用中添加 favicon。首先,你当然得准备一个图标,它应该是一个 16×16 像素的 ICO 格式文件。这不是规定的,但却是一个所有现代浏览器都支持的事实上的标准。将这一图标放置在静态文件目录下并以 favicon.ico 命名。

现在,为了使浏览器找到你的图标,正确的方法是在 HTML 文档中添加一个 link 标签。例如:

<link rel="shortcut icon" href="{{ url_for('static', filename='favicon.ico') }}">

对于大多数浏览器这就足以奏效了,但是一些过于老旧的浏览器不支持这个标准。旧的事实标准是在站点域名的根路径下提供以 favicon.ico 命名的图标文件。如果你的应用不是在站点域名的根路径下创建,那么你需要配置 web 服务器来在根路径下提供图标,如果没办法这样做,你就不太走运了。然而,如果你的应用在根路径下,你可以轻易地注册一个路由重定向至图标:

app.add_url_rule('/favicon.ico',
                 redirect_to=url_for('static', filename='favicon.ico'))

如果你希望避免多余的重定向请求,也可以调用 send_from_directory() 编写一个视图函数:

import os
from flask import send_from_directory

@app.route('/favicon.ico')
def favicon():
    return send_from_directory(os.path.join(app.root_path, 'static'),
                               'favicon.ico', mimetype='image/vnd.microsoft.icon')

其中显式传入的 mimetype 参数可以省略,浏览器将自行判断文件类型。不过我们也可以指定 MIME 类型来避免多余的推测,因为图标文件总是同一类型。

上述代码将通过你的应用来提供图标,不过如果可能的话,更好的方式是配置你所使用的 web 服务器来提供图标。请参考 web 服务器的文档。

另请参阅

  • 维基百科上关于 Favicon 的文章