一个基于flask的web应用诞生 使用模板引擎和表单插件(2)

一个基于flask的web应用诞生 使用模板引擎和表单插件(2),第1张

概述经过了第一章的内容,已经可以做出一些简单的页面,首先用这种方式做一个登录页面,首先要创建一个login的路由方法:

经过了第一章的内容,已经可以做出一些简单的页面,首先用这种方式做一个登录页面,首先要创建一个login的路由方法:

@app.route("/login",methods=["GET"])def login(): HTML="<form method='post'>" \ "<table>" \ "<tr><td>请输入用户名</td><td><input type='text' name='username'/></td></tr>" \ "<tr><td>请输入密码</td><td><input type='password' name='password'/></td></tr>" \ "<tr><td><input type='submit' value='登录'/></td></tr>" \ "</table>" \ "</post>" return HTML

这个页面返回后是一个简单的登录页,显示结果如下:

然后是一个登录的post返回页:

@app.route("/login",methods=["POST"])def loginPost(): username=request.form.get("username","") password=request.form.get("password","") if username=="test" and password=="123" : return "登录成功" else: return "登录失败"

输入test和123后,显示登录成功

功能上当然是实现了,但是从其他方面来说,却很难说它是一个能够实际应用的程序,即使不考虑Js脚本和CSS样式表,就从简简单单的维护来说,就是一场噩梦,比如说像增加一个验证码框,我想不会有人认为这是一件愉快的工作。

所以,首先来说,我们要把页面HTML部分独立出来,这点,flask提供了jinja2模板引擎来实现。

jinja2模板引擎同样符合flask最基础的约定,即众多配置中都有一个基础的默认值,相对jinja2来说,有一个最重要的默认值,即模板文件放在templates文件夹,这个文件夹虽然可以自定义,但目前来说,使用默认值已经足够了。

好,首先在PyCharm的项目根目录创建templates文件夹,然后在文件夹内创建login.HTML文件,当然目录结构如下:

在login.HTML中输入代码如下:

<!DOCTYPE HTML><HTML> <head> <Title>欢迎您登陆--牛博客</Title> </head> <body> <form method='post'> <table> <tr><td>请输入用户名</td><td><input type='text' name='username'/></td></tr> <tr><td>请输入密码</td><td><input type='password' name='password'/></td></tr> <tr><td><input type='submit' value='登录'/></td></tr> </table> </form> </body></HTML>

代码很简单,也名没有进行样式方面的美化,其实目前就我来说,仅仅是因为有了智能感知,就有足够的理由使用模板了,然后,对default.py的login方法进行修改代码为:

from flask import render_template #头部,引入模板渲染方法@app.route("/login",methods=["GET"])def login(): return render_template("/login.HTML")  #渲染模板,默认找templates文件夹下的login.HTML文件

由于HTML模板内的代码和直接直接写在py文件中的一样,所以此时刷新页面,显示效果和刚刚相同,虽然显示效果没有明显的改观,但此时如果修改HTML中的某一元素,则会方便很多。

关于jinja2模板引擎还支持一些更强大的功能,比如使用index做一些说明:

基本用法

修改default.py中的部分代码为:

from flask import render_template #页头,导入渲染函数@app.route("/")def index(): return render_template("index.HTML",site_name='myblog')

index.HTML中的代码为:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>{{site_name}}</Title></head><body><h1>这个站点的名字为 {{site_name}} </h1></body></HTML>

flask的render_template函数支持多参数,其中函数的第一个参数为模板名,之后可以提供若干参数,均为键值对,为模板中的变量提供数据。如此例子中,为site_name提供了myblog的值,而模板内使用{{参数名}}来表示一个变量

此时浏览器输入地址输出结果为:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>myblog</Title></head><body><h1>这个站点的名字为 myblog </h1></body></HTML>

jinja2模板还提供了一些变量过滤器,如代码:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>{{site_name|upper}}</Title></head><body><h1>这个站点的名字为 {{site_name}} </h1></body></HTML>

这时输出为:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>MYBLOG</Title></head><body><h1>这个站点的名字为 myblog </h1></body></HTML>

常用过滤器如下

safe 不转义
cAPItalize 首字母大写
lower 转换为小写
upper 转换为大写
trim 去收尾空格
striptages 去除HTML标签

除此之外,Jinja2的变量还可以是一些复杂类型,甚至可以使用一些复杂类型的常用方法,如:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>{{site_name[2:]}}</Title> </head><body><h1>这个站点的名字为 {{site_name}} </h1></body></HTML>

这时输出为:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>blog</Title></head><body><h1>这个站点的名字为 myblog </h1></body></HTML>

控制语句

控制语句是一个模板的基本功能,同样的jinja2也提供了相应的功能:

//选择{% if name=='test' %} 这是测试{% else %} {{name}},你好{% endif %}//循环<ul> {% for blog in blogs%} {{ blog.Title }} {% endfor%}</ul>

除了这些基本用法,模板还为一些代码的重复使用提供了宏的功能,如将如下代码写入macros.HTML文件中

{% macro render_Title(blog)%} <li>{{blog.Title}}</li>{% endmacro%}

然后在之前的模板中:

{% import 'macros.HTML' as macros %}<ul> {% for blog in blogs %} {{ macros.render_Title(blog) }} {% endfor %}</ul>

执行结果与之前的完全相同

Jinja2还提供了一个更为强大的功能,即模板继承,这个个人感觉有点像java的sitemesh框架,它首先需要创建一个base.HTML的基模板:

<!DOCTYPE HTML><HTML><head> {% block head %} <Meta charset="UTF-8"> <Title>{% block Title%} {% endblock %} - 牛博客</Title> <script src="/uploads/201706/26/14984796784.Js"></script> {% endblock %}</head><body> {% block body %} {% endblock %}</body></HTML>

其中block标签的意思表示在子模板中可以修改,具体到此例子,则可修改的部分为 head,Title,body。下面为子模板代码:

{% extends "base.HTML" %}{% block Title %}{{site_name[2:]}}{% endblock %}{% block head %} {{super()}}{% endblock %}{% block body %} <h1>这个站点的名字为 {{site_name}} </h1>{% endblock %}

此时执行结果仍为:

<!DOCTYPE HTML><HTML><head> <Meta charset="UTF-8"> <Title>blog</Title></head><body><h1>这个站点的名字为 myblog </h1></body></HTML>

现在有了模板引擎,不管怎么说,仅仅就页面层来说,已经可以很轻松的做出一些不错的功能了,但很明显,现在的界面还不是很美观,下一章将把现在主流的前端框架bootstrap与flask框架进行整合。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的一个基于flask的web应用诞生 使用模板引擎和表单插件(2)全部内容,希望文章能够帮你解决一个基于flask的web应用诞生 使用模板引擎和表单插件(2)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://www.outofmemory.cn/langs/1202306.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-04
下一篇 2022-06-04

发表评论

登录后才能评论

评论列表(0条)

保存