python web开发 之 flask教程(三)

今天的任务是应用web表单,知识点很多。我们将代码和具体步骤进行展示。(在这个部分,代码部分红色部分是我们增删的部分) 。

1.我们采用的是Flask-WTK框架。

Flask-WTF是WTForms项目的Flask框架扩展,我们将用他来帮助我们处理web表单。

大部分Flask扩展都需要定义相关配置项,所以我们先来在应用根目录下创建一个配置文件以备使用。我们先这样创建 (config.py):


2.我们要创建一个登录表单,用来进行用户身份识别。但跟平常需要验证用户名和密码的登录方式不同,我们将使用OpenId来处理登录过程。

OpenId的好处就是我们不用管那些用户名和密码的认证过程,交给 OpenId 去搞定,它会返回给我们用户验证后的数据。这样对于使用我们网站的用户而言也更安全。
使用 OpenId 登录只需要一个字符串,然后发送给 OpenId 服务器就行了。另外我们还需要在表单中加一个“记住我” 的选项框,这个是送给那些不想每次来我们网站都要进行身份认证的人。选择这个选项后,首次登录时会用cookie在他们的浏览器上记住他们的登录信息,下次再进入网站时就不需要进行登录操作。

3.接下来我们要制作用户登录表单,使用Flask-WTF创建的表单就像一个对象,需要从Form类继承子类。然后在这个子类中定义一些类的属性变量作为表单字段就可以了。(此处编写出现错误,最下方有关于此处错误的提示。)

python web开发 之 flask教程(三)_第1张图片

我们引入了一个 Form 类,然后继承这个类,按需求还添加了 TextField 和 BooleanField 这两个字段。
另外还引入了一个表单验证函数 Required,这种验证函数可以附加在字段里面,在用户提交表单时它们会用来检查用户填写的数据。这个 Required 函数是用来防止用户提交空数据。Flask-WTF 中还有很多不同作用的表单验证函数,我们将会在后面使用到它们。

4.接下来制作登录表单的模板login.html。python web开发 之 flask教程(三)_第2张图片

其中,我们在配置中开启了CSRF(跨站伪造请求)功能,模板参数 {{ form.hidden_tag() }} 会被替换成一个具有防止CSRF功能的隐藏表单字段。在开启了CSRF功能后,所有模板的表单中都需要添加这个模板参数。

5.接下来我们写一个渲染登录表单对象到模板的视图函数views.py。python web开发 之 flask教程(三)_第3张图片

在这里,我们做了两件事:一件事就是在路由装饰器中添加一个新方法。让 Flask 明白我们这个视图函数支持 GET 和 POST 请求。否则这个视图函数只会响应 GET 请求。我们需要得到用户填写表单后提交的数据,这些数据是从 POST 请求中传递过来的。

引入了两个新对象: falsh 和 redirect。待会具体说他们。

6.Flask-WTF 对表单提交数据的处理使我们的接下来要做的事情变得简单了。下面就是我们这个登录视图函数 views.py的新版本, 加入了表单数据验证和处理。


上面红色部分为新增的,出现三个我们需要说明的知识点:

  • validate_on_submit() 这个方法做了表单处理的所有工作。如果你在表单向用户提供数据时(举个栗子:用户在它之前修改了一下提交的数据) 时调用此方法,它会返回 False。发生这样的情况时,就是提交的数据验证不通过,你要继续渲染模板。只要有一个字段验证不通过,它都会返回 False. 这时就需要我们返回数据给用户,让他们来纠正一下错误数据。后面我们将会看到在数据验证失败时,如何把错误消息显示给用户。
  • 当 validate_on_submit() 方法返回 True 的时候,我们的视图函数又会调用两个新的函数。它们都是从Flask 中引入的,flash 函数用来在下一个打开的页面中显示定义的消息。我们现在用它用来做调试。因为我们现在还没有做用户登录模块, 所以只需要把用户提交上来的数据显示一下就行了。flash 函数非常有用,比如为用户的一些操作提供消息反馈。
        为了更好地了解这个函数,我们可以使用它来进行调试。flash 函数提供的消息不会自动出现在我们的网站页面中,所以我们需要做点事情让它在页面中显示出来。为了让我们所有页面都能有这项激动人心的功能,所以就把它添加到基础模板中吧, 下面是更新后的基础模板 base.html。

python web开发 之 flask教程(三)_第4张图片

这样我们每个页面都会显示消息反馈。

  • 另一个新函数就是 redirect. 这个函数会通知用户的浏览器跳转到指定的地址。在我们的视图函数中,我们使用它跳转到了首页。注意跳转结束后页面上还会显示 flash 函数传递的消息哦。

7.如果我们在用户提交数据失败后给用户点提示,让他们知道什么原因引起的,岂不妙哉!太幸运了,用 Flask-WTF 可以轻松解决这个问题。
当表单字段验证失败时, Flask-WTF 会添加一个错误消息到表单对象。这些消息在模板中也是可以使用的,所以我们只需要在模板中添加一点点东西就OK了。

这个就是我们添加了验证消息的登录模板login.html:

python web开发 之 flask教程(三)_第5张图片

我们仅在 openid 字段的右边添加了一个循环语句,它会把openid字段验证失败的消息都显示出来。不论你的表单有多少字段,所有表单字段验证失败的错误消息都可以用 form.errors.字段名 这种方式来使用。这个表单中我们的是 form.errors.openid。为了让错误消息引起用户的注意,我们还给消息添加了显示红色的 css 样式。

8.现实生活中,我们发现有很多人都不知道他们拥有一些公共账号。一部分大牌的网站或服务商都会为他们的会员提供公共账号的认证。举个栗子,如果你有一个 google 账号,其实你就有了一个公共账号,类似的还有 Yahoo, AOL, Flickr 等。
为了方便我们的用户能简单的使用他们的公共账号,我们将把这些公共账号的链接添加到一个列表,这样用户就不用自手工输入了。

为此我们要做到以下三小步:

(1)我们要把一些提供给用户的公共账号服务商定义到一个列表里面,这个列表就放到配置文件中吧 (config.py):

python web开发 之 flask教程(三)_第6张图片

(2)接下来就是要在我们的登录视图函数views.py中使用这个列表了:

python web开发 之 flask教程(三)_第7张图片

(3)我们从 app.config 中引入了公共账号服务商的配置列表,然后把它作为一个参数通过 render_template 函数引入到模板。接下来我们需要在登录模板中把这些服务商链接显示出来。

python web开发 之 flask教程(三)_第8张图片python web开发 之 flask教程(三)_第9张图片

这次的模板添加的东西似乎有点多。一些公共账号需要提供用户名,为了解决这个我们用了点 javascript。当用户点击相关的公共账号链接时,需要用户名的公共账号会提示用户输入用户名, javascript 会把用户名处理成可用的公共账号,最后再插入到 openid 字段的文本框中。

下面这个是在登录页面点击 google 链接后显示的截图:python web开发 之 flask教程(三)_第10张图片

ps报错解决:

在第3步时,写程序报错了。一个是:原文中的: 
from flask.ext.wtf import Form, TextField, BooleanField
from flask.ext.wtf import Required
在flask-wtf的0.9版之后已经不可用。
见 https://flask-wtf.readthedocs.org/en/latest/upgrade.html#version-0-9-0
0.9版之后的flask-wtf的结构有了不小的改动。如下图:

另一个是IndentationError: unexpected indent错误:

python web开发 之 flask教程(三)_第11张图片

因为python是对格式要求很严格的 ,遇到了IndentationError: unexpected indent你就要知道python编译器是在告诉你“Hi,老兄,你的文件里格式不对了,可能是tab和空格没对齐的问题,你需要检查下tab和空格了”。




你可能感兴趣的:(python,flask)