Python Flask Web框架(四)

一、静态文件

动态的 web 应用同样需要静态文件。CSSJavaScript文件通常来源于此。理想情况下, 你的 web 服务器已经配置好为它们服务,然而在开发过程中 Flask 就能够做到。 只要在你的包中或模块旁边创建一个名为static 的文件夹,在应用中使用/static即可访问。

给静态文件生成 URL ,使用特殊的static端点名:

url_for('static', filename='style.css')

这个文件是应该存储在文件系统上的static/style.css

二、渲染模板

在 Python 中生成 HTML 并不好玩,实际上是相当繁琐的,因为你必须自行做好HTML转义以保持应用程序的安全。 由于这个原因,Flask 自动为你配置好 Jinja2 模版。

你可以使用方法render_template()来渲染模版。所有你需要做的就是提供模版的名称以及你想要作为关键字参数传入模板的变量。这里有个渲染模版的简单例子, 修改hello.py文件:

from flask import render_template

@app.route('/hello/')
@app.route('/hello/<name>')
def hello(name=None):
    return render_template('hello.html', name=name)

Flask 将会在templates文件夹中寻找模版。因此如果你的应用是个模块,这个文件夹在模块的旁边,如果它是一个包,那么这个文件夹在你的包里面:

Case 1:应用是模块(本系列实验的应用结构都是模块型):

/application.py
/templates
    /hello.html

Case 2: 应用是包:

/application
    /__init__.py
    /templates
        /hello.html

对于模板,你可以使用 Jinja2 模板的全部能力。详细信息查看官方的 Jinja2 Template Documentation 。

这里是一个模版的例子,在这之前需要建立文件结构如下图所示:

此处输入图片的描述

然后编写hello.html模板文件:

<!doctype html>
<title>Hello from Flask</title>
{% if name %}
  <h1>Hello {{ name }}!</h1>
{% else %}
  <h1>Hello World!</h1>
{% endif %}

效果如下(这里建议在图形界面下开启两个终端,一个用来启动服务器,一个用来编写代码):

此处输入图片的描述

在模版中你也可以使用requestsessiong对象,也能使用函数get_flashed_messages() 。

模版继承是十分有用的。如果想要知道模版继承如何工作的话,请阅读文档模板继承。基本的模版继承使得某些特定元素(如标题,导航和页脚)在每一页成为可能。

自动转义默认是开启的,因此如name包含 HTML,它将会自动转义。如果你信任一个变量,并且你知道它是安全的(例如一个模块把 wiki 标记转换到 HTML ),你可以用Markup类或|safe过滤器在模板中标记它是安全的。 在 Jinja 2 文档中,你会见到更多例子。

下面一个Markup类如何工作的基本介绍:

$ python
>>> from flask import Markup
>>> Markup('<strong>Hello %s!</strong>') % '<blink>hacker</blink>'
Markup(u'<strong>Hello &lt;blink&gt;hacker&lt;/blink&gt;!</strong>')
>>> Markup.escape('<blink>hacker</blink>')
Markup(u'&lt;blink&gt;hacker&lt;/blink&gt;')
>>> Markup('<em>Marked up</em> &raquo; HTML').striptags()
u'Marked up \xbb HTML'

注意:在后面的0.5版本以上:

自动转义不再在所有模版中启用。模板中下列后缀的文件会触发自动转义:.html, .htm, .xml,.xhtml。从字符串加载的模板会禁用自动转义。

三、小结

本节讲了 flask 的静态文件和模板的基本知识,静态文件放在 static目录中,模板文件放在templates目录下。

四、练习

请创建一个模板和CSS文件,并在模板引入CSS文件,显示一个绿色的Hello ShiYanLou字样。关于HTML以及CSS的学习请参考在线教程

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值