Login验证页面例子
登陆验证页面后台输入项目定义
forms.py
"""
页面form定义
"""
from __future__ import absolute_import, print_function, unicode_literals
from flask_wtf import FlaskForm
import wtforms as wtf
class LoginForm(FlaskForm):
"""
登陆页面入力项目的验证定义
"""
email = wtf.StringField(
'email:', validators=[
wtf.validators.DataRequired(),
wtf.validators.Length(min=6, max=35)])
password = wtf.PasswordField(
'password:', validators=[
wtf.validators.DataRequired()])
登陆验证页面url定义
view_login.py
@app.route('/')
def view_login():
"""
登陆页面
登陆成功后,非表示
"""
# 页面form设定取得
form = forms.LoginForm(request.form)
# 页面标题设置
res = {
'page_title': '登陆',
}
# 页面表示数据
context = {
'res': res,
'form': form,
}
return render_template(
'view_login.html',
**context
)
登陆按钮事件定义
view_login.py
@app.route('/login', methods=['POST'])
def view_login_action():
# Formobj
form = forms.LoginForm(request.form)
# 页面标题设置
res = {
'page_title': '登陆结果',
}
# 页面表示数据
context = {
'res': res,
'form': form,
}
# 输入验证
for key, value in form.errors.items():
form.errors[key] = form[key].error_class()
if not form.validate():
# 错误信息页面表示
for key, value in form.errors.items():
flash('{}: {}'.format(key, str(value)), 'error')
return render_template(
'view_login.html',
**context,
)
# 邮件地址
email = form.email.data
# 密码
password = form.password.data
if not (email == 'aa@bb.cc' and password == '1234'):
flash('输入信息有误!')
return render_template(
'view_login.html',
**context,
)
return "login sucess"
前台html定义
view_login.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>{{res.page_title}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<link rel="stylesheet" href="{{ url_for('static', filename='fontawesome-free/css/all.min.css')}}" />
<link rel="stylesheet" href="{{ url_for('static', filename='AdminLTE/css/adminlte.min.css')}}" />
</head>
<body class="hold-transition login-page">
<div class="login-box">
<div class="login-logo">
<a href="{{ url_for('views.login.view_login') }}">{{res.page_title}}</a>
</div>
<div class="card">
{% with messages = get_flashed_messages(with_categories=true) %}
{% if messages %}
<div class="alert alert-danger alert-dismissible">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<p><i class="fas fa-exclamation"></i>登陆错误信息</p>
{% for category, message in messages %}
{{ message }}
{% endfor %}
</div>
{% endif %}
{% endwith %}
<div class="card-body login-card-body">
<p class="login-box-msg">Login</p>
<form action="{{ url_for('views.login.view_login_action') }}" method="post">
{{ form.csrf_token }}
<div class="input-group mb-3">
{{ form.email(class_="form-control", type="email", placeholder="Email") }}
<div class="input-group-append">
<span class="fa input-group-text"><i class="fas fa-envelope"></i></span>
</div>
</div>
<div class="input-group mb-3">
{{ form.password(class_="form-control", type="password", placeholder="Password") }}
<div class="input-group-append">
<span class="fa input-group-text"><i class="fas fa-lock"></i></span>
</div>
</div>
<div class="row">
<div class="col-8">
</div>
<div class="col-4">
<button type="submit" class="btn btn-primary btn-block float-right">Login</button>
</div>
</div>
</form>
</div>
</div>
</div>
<script type="text/javascript" src="{{ url_for('static', filename='jquery/jquery.min.js') }}"></script>
<script type="text/javascript" src="{{ url_for('static', filename='bootstrap/js/bootstrap.bundle.min.js') }}"></script>
</body>
</html>
参照
AdminLTE源代码
例子