【Flask微电影】24.前台会员中心，会员注册登录退出

个人博客，欢迎查看：https://blog.starmeow.cn/

Github地址：https://github.com/xyliurui/FlaskMovie

会员中心

会员注册

创建会员注册表单

from flask_wtf import FlaskForm
from wtforms import StringField, PasswordField, SubmitField, TextAreaField, SelectField, FileField, SelectMultipleField
from wtforms.validators import DataRequired, ValidationError, EqualTo, Email, Regexp

from app.models import User


class RegisterForm(FlaskForm):
    name = StringField(
        label='昵称',
        validators=[
            DataRequired('请输入昵称！')
        ],
        description='昵称',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入昵称",
            'required': "required",
            'autofocus': "autofocus"
        }
    )
    email = StringField(
        label='邮箱',
        validators=[
            DataRequired('请输入邮箱！'),
            Email('邮箱格式不正确')
        ],
        description='邮箱',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入邮箱",
            'required': "required",
            'autofocus': "autofocus"
        }
    )
    phone = StringField(
        label='手机',
        validators=[
            DataRequired('请输入手机！'),
            Regexp('^1[3|4|5|6|7|8][0-9]\d{4,8}$', message='手机格式不正确')
        ],
        description='手机',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入手机",
            'required': "required",
            'autofocus': "autofocus"
        }
    )
    pwd = PasswordField(
        label='密码',
        validators=[
            DataRequired('请输入密码！')
        ],
        description='密码',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入密码",
            'required': "required"
        }
    )
    repwd = PasswordField(
        label='重复密码',
        validators=[
            DataRequired('请输入重复密码！'),
            EqualTo('pwd', message='两次密码不一致')
        ],
        description='重复密码',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入重复密码",
            'required': "required"
        }
    )
    submit = SubmitField(
        label='注册',
        render_kw={
            'class': "btn btn-lg btn-success btn-block"
        }
    )

    def validate_name(self, field):
        name = field.data
        num = User.query.filter_by(name=name).count()
        if num == 1:
            raise ValidationError('昵称已经存在，请重新输入')

    def validate_email(self, field):
        email = field.data
        num = User.query.filter_by(email=email).count()
        if num == 1:
            raise ValidationError('邮箱已经存在，请重新输入')

    def validate_phone(self, field):
        phone = field.data
        num = User.query.filter_by(phone=phone).count()
        if num == 1:
            raise ValidationError('手机号已经存在，请重新输入')

修改register会员注册视图

允许get和post方法

from . import home
from flask import render_template, redirect, url_for, flash
from .forms import RegisterForm
from app.models import User
from werkzeug.security import generate_password_hash
from app import db
import uuid


@home.route('/register/', methods=['GET', 'POST'])
def register():
    form = RegisterForm()
    if form.validate_on_submit():
        data = form.data
        user = User(
            name=data['name'],
            pwd=generate_password_hash(data['pwd']),
            email=data['email'],
            phone=data['phone'],
            uuid=uuid.uuid4().hex
        )
        db.session.add(user)
        db.session.commit()
        flash('注册成功', category='ok')
        return redirect(url_for('home.register'))
    return render_template('home/register.html', form=form)

修改register.html会员注册模板

<div class="panel-body">
    {% with msgs = get_flashed_messages(category_filter=['ok']) %}
        {% if msgs %}
            {% for msg in msgs %}
                <p>{{ msg }}</p>
            {% endfor %}
        {% endif %}
    {% endwith %}

    <form role="form" method="post">
        <fieldset>
            <div class="form-group">
                <label for="input_name"><span class="glyphicon glyphicon-user"></span>&nbsp;{{ form.name.label }}</label>
                {{ form.name }}
            </div>
            {% for err in form.name.errors %}
                <div class="col-md-12" style="color: red">{{ err }}</div>
            {% endfor %}
            <div class="form-group">
                <label for="input_email"><span class="glyphicon glyphicon-envelope"></span>&nbsp;{{ form.email.label }}</label>
                {{ form.email }}
            </div>
            {% for err in form.email.errors %}
                <div class="col-md-12" style="color: red">{{ err }}</div>
            {% endfor %}
            <div class="form-group">
                <label for="input_phone"><span class="glyphicon glyphicon-phone"></span>&nbsp;{{ form.phone.label }}</label>
                {{ form.phone }}
            </div>
            {% for err in form.phone.errors %}
                <div class="col-md-12" style="color: red">{{ err }}</div>
            {% endfor %}
            <div class="form-group">
                <label for="input_password"><span class="glyphicon glyphicon-lock"></span>&nbsp;{{ form.pwd.label }}</label>
                {{ form.pwd }}
            </div>
            {% for err in form.pwd.errors %}
                <div class="col-md-12" style="color: red">{{ err }}</div>
            {% endfor %}
            <div class="form-group">
                <label for="input_repassword"><span class="glyphicon glyphicon-lock"></span>&nbsp;{{ form.repwd.label }}</label>
                {{ form.repwd }}
            </div>
            {% for err in form.repwd.errors %}
                <div class="col-md-12" style="color: red">{{ err }}</div>
            {% endfor %}
            {{ form.csrf_token }}
            {{ form.submit }}
        </fieldset>
    </form>
</div>

image.png image.png

会员登录

创建会员登录表单

class LoginFrom(FlaskForm):
    """会员登录表单"""
    name = StringField(
        label='账号',
        validators=[
            DataRequired('请输入账号！')
        ],
        description='账号',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入账号",
            'required': "required"
        }
    )

    pwd = PasswordField(
        label='密码',
        validators=[
            DataRequired('请输入密码！')
        ],
        description='密码',
        render_kw={
            'class': "form-control input-lg",
            'placeholder': "请输入密码",
            'required': "required",
            'autofocus': 'autofocus'
        }
    )
    submit = SubmitField(
        label='登录',
        render_kw={
            'class': "btn btn-lg btn-success btn-block"
        }
    )

    def validate_name(self, field):
        """从Admin数据库中，检测账号是否存在，如果不存在则在account.errors中添加错误信息"""
        account = field.data
        num = User.query.filter_by(name=account).count()
        if num == 0:
            raise ValidationError('账号不存在')

修改login会员登录视图

from flask import render_template, redirect, url_for, flash, session, request
from .forms import RegisterForm, LoginFrom
from app.models import User, UserLog


@home.route('/login/', methods=['GET', 'POST'])
def login():
    form = LoginFrom()
    if form.validate_on_submit():
        data = form.data
        user = User.query.filter_by(name=data['name']).first()
        if not user.check_pwd(data['pwd']):
            flash('密码错误', category='err')
            return redirect(url_for('home.login'))
        session['login_user'] = user.name
        session['login_user_id'] = user.id
        userlog = UserLog(
            user_id=user.id,
            ip=request.remote_addr
        )
        db.session.add(userlog)
        db.session.commit()
        return redirect(url_for('home.user'))
    return render_template('home/login.html', form=form)

创建alert_info.html通用flash模板

在templates/home/文件夹下创建

{% with msgs = get_flashed_messages(category_filter=['ok']) %}
    {% if msgs %}
        {% for msg in msgs %}
            <p>{{ msg }}</p>
        {% endfor %}
    {% endif %}
{% endwith %}
{% with msgs = get_flashed_messages(category_filter=['err']) %}
    {% if msgs %}
        {% for msg in msgs %}
            <p>{{ msg }}</p>
        {% endfor %}
    {% endif %}
{% endwith %}

修改login.html会员登录模板

{% include 'home/alert_info.html' %}
    <form role="form" method="post">
        <fieldset>
            <div class="form-group">
                <label for="input_contact"><span class="glyphicon glyphicon-user"></span>&nbsp;{{ form.name.label }}</label>
                {{ form.name }}
                {% for err in form.name.errors %}
                    <div class="col-md-12" style="color: red">{{ err }}</div>
                {% endfor %}
            </div>
            <div class="col-md-12" id="error_contact"></div>
            <div class="form-group">
                <label for="input_password"><span class="glyphicon glyphicon-lock"></span>&nbsp;{{ form.pwd.label }}</label>
                {{ form.pwd }}
                {% for err in form.pwd.errors %}
                    <div class="col-md-12" style="color: red">{{ err }}</div>
                {% endfor %}
            </div>
            {{ form.csrf_token }}
            {{ form.submit }}
        </fieldset>
    </form>

image.png

会员退出

修改logout会员退出视图

@home.route('/logout/')
def logout():
    session.pop('login_user', None)
    session.pop('login_user_id', None)
    return redirect(url_for('home.login'))