Python Flask学习_使用flask-login实现认证蓝本(二)

在 点击打开链接中,讲解了如何使用flask-login扩展实现用户认证中的与数据库互动(通过改动模型User类)、注册到app、实现回调函数的内容。

这篇主要介绍登录页面的实现 。

目标:实现如下的登录页面:


分析这个页面可以看出,应该包含一个表单。表单包含一个用于输入电子邮件地址的文本字段、一个密码字段、一个“记住我”复选框和一个提交按钮。

文本字段的验证函数应当包括:必须是邮件地址格式、长度应该适中、不能为空

密码字段的验证函数应当包括:不能为空

下面看一下使用flask-wtf实现表单

如果未安装flask-wtf的要先安装。

# pyCharm Terminal
pip install Flask_Wtf

一、引入需要使用的类/函数等

# app/auth/forms.py

from flask_wtf import Form                                                        #引入Form类
from wtforms import StringField,PasswordField,BooleanField,SubmitField            #从wtforms模块中引入4个字段
from wtforms.validators import Required,Length,Email                                #从wtforms.validators中引入3个验证函数

StringField对应文本字段,用于填写电子邮件地址。

PasswordField对应密码字段,用于填写密码 。

BooleanField对应复选框。

SubmitField对应提交按钮 。

二、实现表单类

# app/auth/forms.py

class LoginForm(Form):                                                                      #继承自Form类
    email = StringField('Email',validators=[Required(),Length(1,64),Email()])               #lineEdit
    password = PasswordField('Password',validators=[Required()])                            #password edit
    submit = SubmitField('Log In')                                                          #按钮
    remember_me = BooleanField('Keep me logged in')                                         #复选框

三、使用表单类渲染HTML模板 

# app/templates/auth/login.html

{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}                                

{% block title %}Flasky - Login{% endblock %}

{% block page_content %}
<div class="page-header">
    <h1>Login</h1>
</div>
<div class="col-md-4">
    {{ wtf.quick_form(form) }}
</div>
{% endblock %}
要想使用wtf.quick_form()来渲染模板,必须引入wtf.html:
{% import "bootstrap/wtf.html" as wtf %}  

这样模板就渲染了,再通过视图函数返回即可。

四、在导航栏加上登录/登出按钮

login.html是一个登录页面。通过导航栏上添加按钮,链接到login.html页面。

#  app/templates/base.html
#...
            <ul class="nav navbar-nav navbar-right">
                {% if current_user.is_authenticated %}
                <li><a href="{{ url_for('auth.logout') }}">Log Out</a> </li>
                {% else %}
                <li><a href="{{ url_for('auth.login') }}">Log In</a> </li>
                {% endif %}
            </ul>

判断条件中的变量current_user是由Flask-Login定义的,在视图函数和模板中是自动可用的。

url_for('auth.logout')返回auth.logout的URL。







猜你喜欢

转载自blog.csdn.net/bird333/article/details/80858729