博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Flask驱动的静态站点生成器(译)
阅读量:6304 次
发布时间:2019-06-22

本文共 5812 字,大约阅读时间需要 19 分钟。

hot3.png

{% include JB/setup %}

翻译自:

纯意译……以下是正文,和jekyll很像的感觉,哈?34行代码完成一个静态站点生成器。


我想将我的在线身份统合到一个单独的托管地方很久了,因此有了你现在浏览的这个网站。我也寻找一个静态网站架构有段时间了,尝试了许多但一个也不中意。这真令人沮丧。

然后遇到:

<blockquote class="twitter-tweet tw-align-center"> <p>Frozen-Flask is really, really useful. Should have used that earlier.</p>&mdash; Armin Ronacher (@mitsuhiko) <a href="https://twitter.com/mitsuhiko/status/166570613295689728" data-datetime="2012-02-06T17:15:03+00:00">February 6, 2012</a> </blockquote>

是这个Python微框架的作者,我喜欢flask的简洁。所以这个tweet一个机灵,我便开始探索的玩法。

Frozen-Flask将Flask应用_冻结_成静态文件,这样你能够高速而无痛地部署它们。再佐以,你获得了完美的生成静态站点工具集,这个站点将有所以你使用框架能得到的特性。

  • 酷的urls和简单的路径管理
  • 强大的模板
  • 本地动态服务
  • 静态版本管理

第一轮:项目搭建

在新文件夹中创建个新的,使用安装必要的包:

$ mkdir sample_project && cd !$$ mkvirtualenv --no-site-packages `pwd`/env$ source env/bin/activate$ pip install Flask Frozen-Flask Flask-FlatPages

写我们第一个版本的sitebuilder.py

from flask import Flaskapp = Flask(__name__)@app.route("/")def index():    return "Hello World!"if __name__ == "__main__":    app.run(port=8000)

运行它;你应该看到类似:

$ python sitebuilder.py  * Running on http://127.0.0.1:8000/  * Restarting with reloader

用浏览器打开_

又一轮:添加纯文本页面

为你的Flask应用提供一套页面。相对动态页面从关系数据库构建,静态页面是从纯文本文件构建。

在你的项目跟文件夹下创建一个pages/目录,新建一个hello-wolrd.md扔进去:

$ mkdir pages $ vi pages/hello-world.md

hello-world.md文件:

title: Hello Worlddate: 2012-03-04**Hello World**, from a *page*!

如你所见你可以在页面内容中写入。所以让我们重新写我们的应用来为通过文件名为任何纯文本提供服务。

from flask import Flaskfrom flask_flatpages import FlatPagesDEBUG = TrueFLATPAGES_AUTO_RELOAD = DEBUGFLATPAGES_EXTENSION = '.md'app = Flask(__name__)app.config.from_object(__name__)pages = FlatPages(app)@app.route('/')def index():    return "Hello World"@app.route('/
/')def page(path): return pages.get_or_404(path).htmlif __name__ == '__main__': app.run(port=8000)

现在访问http://127.0.0.1:8000/hello-world/将呈现渲染后的纯文本。注意通过page对象获得html属性markdown源码被转换成html。

又一轮:添加模板

flask使用模板引擎,让我们创建一些模板来装饰页面。首先在项目根目录下创建一个templates文件夹:

$ mkdir templates

templates/base.html中创建基本布局:

    
My site

My site

{% block content %}

Default content to be displayed

{% endblock content %}

注意url_for()这个模板函数,这是我们使用Flask和Jinjia2生成url的方式。

现在用page.html模板来填充页面内容的布局:

{% extends "base.html" %}{% block content %}    

{
{ page.title }}

{
{ page.html|safe }}{% endblock content %}

我们的应用现在应该是:

from flask import Flask, render_templatefrom flask_flatpages import FlatPagesDEBUG = TrueFLATPAGES_AUTO_RELOAD = DEBUGFLATPAGES_EXTENSION = '.md'app = Flask(__name__)app.config.from_object(__name__)pages = FlatPages(app)@app.route('/')def index():    return "Hello World"@app.route('/
/')def page(path): page = pages.get_or_404(path) return render_template('page.html', page=page)if __name__ == '__main__': app.run(port=8000)

见鬼,我们刚刚做了什么?

  • 创建了一个应用的模板;一个通用布局(base.html)和一个页面模板(page.html)
  • 我们使用render_template函数对页面用页面模板装饰。
  • 页面模板扩展基本模板来避免在每个页面都复制粘帖相同的内容。

又一轮:在主页呈现页面列表

现在我们的主页弱爆了。我们让它列出所有存在的页面。

创建一个templates/index.html

{% extends "base.html" %}{% block content %}    

List of stuff

{% endblock content %}

随意地创建更多纯文本页面,就像我们创建hello-world.md一样,将文件保存在pages/目录下,使用.md扩展名。

我们应用中的index()路径现在应该这样:

重载主页,页面列表将呈现。真他×简单。

又一轮:给页面添加元数据

Flask-FlatPages允许像我们创建和hello-world.md的标题和日期一样添加元数据,并且通过page.meta来存取它们,获得看上去蠢蠢的python字典。真令人吃惊,不是吗?

让我们假设想要给页面添加标签,我们的hello-world.md将变成:

title: Hello Worlddate: 2012-03-04tags: [general, awesome, stuff]**Hello World**, from a *page*!

元数据用描述,因此你能够使用字符串、布尔、整数、浮点、列表、甚至字典,它们将转换成Python相应的内在等价物。

我们将使用两个包含共享部分的不同的模板来列出普通页面和标签页面,index.html现在应该是:

{% extends "base.html" %}{% block content %}    

List of stuff

{% with pages=pages %} {% include "_list.html" %} {% endwith %}{% endblock content %}

创建tag.html模板,它将用来呈现标签页面列表:

{% extends "base.html" %}{% block content %}    

List of stuff tagged {
{ tag }}

{% with pages=pages %} {% include "_list.html" %} {% endwith %}{% endblock content %}

新建的_list.html模板应该包含:

    {% for page in pages %}
  • {
    { page.title }}
    {% if page.meta.tags|length %} | Tagged: {% for page_tag in page.meta.tags %} {
    { page_tag }}
    {% endfor %} {% endif %}
  • {% else %}
  • No page.
  • {% endfor %}

向应用中添加新的tag路径,使用新的tag.html模板:

@app.route('/tag/
/')def tag(tag): tagged = [p for p in pages if tag in p.meta.get('tags', [])] return render_template('tag.html', pages=tagged, tag=tag)

注:若你之前不喜欢python的,现在你会了。

又一轮:生成静态页面

好的,现在我们只要有一个动态网站,为存储在文件系统上的纯文本页面提供服务:废话。但是我们当然不是Flask应用而是一堆静态文件,省去了任何应用服务器。

来进入Frozen-Flask。它的使用真××简单:

import sysfrom flask import Flask, render_templatefrom flask_flatpages import FlatPagesfrom flask_frozen import FreezerDEBUG = TrueFLATPAGES_AUTO_RELOAD = DEBUGFLATPAGES_EXTENSION = '.md'app = Flask(__name__)app.config.from_object(__name__)pages = FlatPages(app)freezer = Freezer(app)@app.route('/')def index():    return render_template('index.html', pages=pages)@app.route('/tag/
/')def tag(tag): tagged = [p for p in pages if tag in p.meta.get('tags', [])] return render_template('tag.html', pages=tagged, tag=tag)@app.route('/
/')def page(path): page = pages.get_or_404(path) return render_template('page.html', page=page)if __name__ == '__main__': if len(sys.argv) > 1 and sys.argv[1] == "build": freezer.freeze() else: app.run(port=8000)

然后运行:

$ python sitebuilder.py build

打开构建文件夹键入如下命令:

$ tree.├── hello-world│   └── index.html├── index.html└── tag    ├── awesome    │   └── index.html    ├── general    │   └── index.html    └── stuff        └── index.html5 directories, 5 files

想法:吓坏了

你现在能部署build目录下的任何文件到任何能托管静态文件的地方了,而你仅仅用34行Python代码就完成了……不错吧?

当然,现在的版本弱爆了,你能一点一点的为它添加各种特性了。

转载于:https://my.oschina.net/u/175377/blog/90364

你可能感兴趣的文章
[Android Pro] Android异步任务处理之AsyncTaskLoader的使用
查看>>
[Web 前端] 流行的JavaScript库 ——jQuery
查看>>
全国信息学奥林匹克联赛(NOIP2014)复赛 模拟题Day2 长乐一中
查看>>
Maven-Profile
查看>>
Entity Framework的原理及使用方式
查看>>
求二叉树中两个节点的最低父节点
查看>>
获取屏幕旋转的通知
查看>>
Oracle Job
查看>>
ambari2.4.2在CentOS7上的二次开发
查看>>
【题解】Berland.Taxi Codeforces 883L 模拟 线段树 堆
查看>>
POJ1502 MPI Maelstrom Dijkstra
查看>>
java时间处理工具类--DateUtils
查看>>
消隐算法
查看>>
What Is Software Design? 先放上来有空看看~
查看>>
hdu 1106
查看>>
table.insert(tableName, v)
查看>>
struts2和hibernate整合的小Demo
查看>>
使程序以管理员权限运行(C++)
查看>>
CListCtrl 实现排序功能(数字和字母)
查看>>
vuejs electron webpack集成使用
查看>>