Windows 10家庭中文版,Python 3.6.4,Flask 1.0.2

前面看了Flask的Quickstart文档,可是,一直没有练习里面的内容,这不,刚刚练习完毕,来写篇博文记录一下!

静态文件

我的Flask项目时一个单独的模块,因此,要使用静态文件,只需要在模块所在目录下建立static文件夹,然后把静态文件放入其中。

Flask项目启动后,使用“/static/”加上<文件名>就可以访问静态文件了。

/static/<文件名>

说明,在Quickstart文档中,如果Flask项目是package的话,将static文件夹放到package的根目录下。

我的测试是放了一个html文件进入,命名为static1.html,代码如下:

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Static Files Test</title>
</head>
<body>
<h1>This is the first satic file of Flask.</h1>
</body>
</html>

然后,启动hello.py模块:成功

访问上面建立的静态文件:成功

什么是静态文件呢?CSS、JavaScript、图片、音频、视频,甚至HTML文件都是……在我看来,只要放到static文件夹中,就是“静态文件”。

当然,在Quickstart文档介绍中,只提到了CSS、JavaScript文件。需要进行测试,并找更多资料来证明。

在Quickstart文档中介绍的静态文件的使用内置服务器仅适用于项目开发阶段,在生产环境部署时,静态文件是由Web服务器(比如Nginx)

处理、分发的。

很简单、快捷,的确。

模板

为什么使用模板?将数据和视图分离,分离之后,再使用模板引擎将两者生成带数据页面(专业名词叫 渲染(Render))返回给客户端浏览器。

Flask的模板引起是 Jinja2。

Quickstart中介绍了一个render_template()函数来渲染模板,并将一个name变量渲染到了模板中,代码如下:

 return render_template('hello.html', name=name)

在hello.html中一定定义了变量{{ name }}。

模板文件放在哪里?

按照下面的说明创建templates文件夹,,

-项目是一个模块,放到和模块同一目录下;

-项目是package,放到package的根目录下;

然后,将模板文件放入templates文件夹即可。

说明,和前面介绍的static文件夹位置相同。

接下来,建立一个模板文件tmpt1.html进行测试,源码如下:

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Rendering Templates test</title>
</head>
<body>
{{ name }}
</body>
</html>

上面的模板文件仅仅定义了一个变量{{ name }}。

目前接触的模板文件都是HTML文件,是否可以是其它文件呢?还需更多了解。

然后,在hello.py中编写处理模板渲染的URL处理函数:

 @app.route("/tmpt")
def tmptTest():
ctx = {}
ctx['name'] = 'Benjamin'
return render_template('tmpt1.html', **ctx)

启动项目,访问/tmpt链接:成功输出处理函数中需要被渲染的数据

进一步测试: 在模板文件中添加处理函数中没有的参数

前面的模板文件中添加了一个变量{{ name }},现在,再添加一个变量{{ yourname }},保持处理函数不变——仍然只提供一个name。

 <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Rendering Templates test</title>
</head>
<body>
{{ name }}<br />
{{ yourname }}<br />
</body>
</html>

启动项目,访问页面:页面和之前一样,不过,Chrome的控制台没有报错。

千万注意,在更新模板文件后,一定要重启项目!否则,新的模板文件是不会生效的!~经过测试,项目模块文件更新后,也需要

重启才会生效!~总之,只要有改动,那边重启项目!

下面是更新后的项目模块文件,及重启后访问到的页面:显示了name、yourname变量的内容。

测试模板是遇到的错误:

在第一次使用render_template()函数时,将字典参数ctx直接写进入,然后启动得到如下错误:

提示我render_template()函数只有一个位置参数,而我给了两个!那么,我用错了!

查看render_template()函数的文档得知,的确只有一个位置参数,然后是关键词参数:

然后,给我的字典参数ctx加上两颗星号,问题就解决了。

看来,自己对Python函数的各种参数还是不太熟悉啊!位置参数、默认值参数、关键词参数~~

为什么会发生此错误?

一是由于没有细查,二是因为前面使用Django的渲染函数时传入的参数是一个字典的影响。

至此,本次测试完毕。

更多关于这方面的内容,还得查看官方文档才是。

参考链接:

Quickstart之Static Files

Quickstart之Rendering Templates

render_template()使用说明

Flask:静态文件&模板(0.1)的更多相关文章

  1. Flask 静态文件缓存问题

    大家好,今天才发现很多学习Flask的小伙伴都有这么一个问题,清理缓存好麻烦啊,今天就教大家怎么解决. 大家在使用Flask静态文件的时候,每次更新,发现CSS或是Js或者其他的文件不会更新. 这是因 ...

  2. flask静态文件

    Flask 静态文件 Web应用程序通常需要静态文件,例如javascript文件或支持网页显示的CSS文件.通常,配置Web服务器并为您提供这些服务,但在开发过程中,这些文件是从您的包或模块旁边的s ...

  3. Flask -- 静态文件 和 模板渲染

    静态文件 一般用于存放图片,样式文件(css, js等) 保存位置:包中或者文件所在目录创建一个 static 目录 访问:在应用中使用 /static/...即可访问 , 更好的方式是使用url_f ...

  4. Flask:Flask的模板系统和静态文件

    1.Flask模板系统 Django框架有自己独立的模板系统,而Flask是没有的,Flask默认采用jinjia2模板系统,jinjia2是仿写Django模板系统的一个第三方模块,但性能上要比Dj ...

  5. Django 2.0 学习(13):Django模板继承和静态文件

    Django模板继承和静态文件 模板继承(extend) Django模板引擎中最强大也是最复杂的部分就是模板继承了,模板继承可以让我们创建一个基本的"骨架"模板,它可以包含网页中 ...

  6. 潭州课堂25班:Ph201805201 tornado 项目 第七课 界面美化和静态文件处理(课堂笔记)

    tornado 相关说明 使用  Bootstrap 前端框架 可以在 bootCDN 这里找 jquery ,poppe.js 文件 美化项目 twittel 的开源项目, 在 static 目录下 ...

  7. django的静态文件的引入

    django的静态文件的引入 1.路径配置 在templates文件夹的同级目录下新建static文件夹 在setting里面写上STATICFILES_DIRS = [os.path.join(BA ...

  8. flask模板应用-加载静态文件:添加Favicon,使用CSS框架,使用宏加载静态资源

    加载静态文件 一个Web项目不仅需要HTML模板,还需要许多静态文件,比如CSS.JavaScript文件.图片和声音声.在flask程序中,默认需要将静态文件存储在与主脚本(包含程序实例的脚本)同级 ...

  9. Flask初级(四)flash在模板中使用静态文件

    Project name :Flask_Plan templates: 默认设置下,Flask在程序根目录中名为static的子目录中寻找静态文件. 随便找个图片放进去把,命令test.png Fla ...

随机推荐

  1. 【BZOJ4916】神犇和蒟蒻 解题报告

    [BZOJ4916]神犇和蒟蒻 Description 很久很久以前,有一群神犇叫sk和ypl和ssr和hjh和hgr和gjs和yay和xj和zwl和dcx和lyy和dtz和hy和xfz和myh和yw ...

  2. 解题:CF1009 Dominant Indices

    题面 长链剖分模板题 只能按深度统计,同时比DSU on tree难理解一些,但是复杂度少个log 对每个点抓出向下延伸最长的儿子叫做长儿子.在合并时用指针继承信息,对于长儿子O(1)继承,其他儿子暴 ...

  3. OpenCV-跟我一起学数字图像处理之直方图均衡化

    从这篇博文开始,小生正式从一个毫不相干专业转投数字图像处理.废话不多说了,talk is cheap. show me the code. 直方图均衡化目的 由于一些图像灰度的分布过于集中,这样会导致 ...

  4. nltk31_twitter情感分析

    sklearn实战-乳腺癌细胞数据挖掘(博主亲自录制视频教程) https://study.163.com/course/introduction.htm?courseId=1005269003&am ...

  5. Tomcat权威指南-读书摘要系列4

    4. Tomcat的性能调校 测量Web服务器的性能 测试负载的工具 Apache Benchmark Siege JMeter

  6. NandFlash、NorFlash、DataFlash、SDRAM释义

    1. NandFlash和NorFlash       Flash存储芯片,俗称闪存,因其具有非易失性.可擦除性.可重复编程及高密度.低功耗等特点,广泛地应用于手机.数码相机.笔记本电脑等产品.    ...

  7. windows安装filebeat服务报错

    cmd进入filebeat目录下   用以下命令执行: PowerShell.exe -ExecutionPolicy UnRestricted -File .\install-service-fil ...

  8. 高质量API网关组件实现

    PI网关组件的作用? 1.网关直接代替MVC当中的Controller层,减少编码量提高开发效率 2.统一API接口的出入参格式,提高API的友好性 3.自动检测API接口规范,提高接口的质量 4.统 ...

  9. php设计模式之六大设计原则

      1.单一职责 定义:不要存在多于一个导致类变更的原因.通俗的说,即一个类只负责一项职责. 场景:类T负责两个不同的职责:职责P1,职责P2.当由于职责P1需求发生改变而需要修改类T时,有可能会导致 ...

  10. 你对position的了解到底有多少?

    此文根据Steven Bradley的<How Well Do You Understand CSS Positioning?>所译,整个译文带有我自己的理解与思想,如果译得不好或不对之处 ...