【Flask项目】首页用户显示与退出 # 10

最新推荐文章于 2025-04-29 17:55:32 发布

MoShyoKi

最新推荐文章于 2025-04-29 17:55:32 发布

阅读量380

点赞数 2

CC 4.0 BY-SA版权

分类专栏： Flask项目文章标签： flask python

本文链接：https://blog.youkuaiyun.com/MoShyoKi/article/details/120777817

Flask项目专栏收录该内容

17 篇文章

订阅专栏

本文介绍如何在Flask项目中实现在首页根据用户状态显示“登录/注册”或“用户信息退出”。当存在session时，显示用户信息；否则，显示登录注册选项。详细内容包括后端Flask代码的实现，HTML页面的设计，以及登出功能的前后端处理方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

首页展示：

如图所见，首页用户的展示应当是 "登录 / 注册" 与 "用户信息退出" 二选其一

对此，做出一些操作，使存在状态保持时，显示用户信息。

不存在session时，显示 "登录 / 注册"

首页相关：

将首页相关的视图函数都写在index对应的views里

后端Flask代码：

from . import blue_index
from flask import render_template, current_app, session, abort
from info.models import User


@blue_index.route("/")
def index():
    """
        首页相关
            右上角个人信息
            1.获取session信息
            2.利用id查询数据库中信息
            3.返回信息到前端页面
    :return:
    """
    # 1.获取session信息(id)
    id = session.get("id")
    user = None
    
    # 2.利用id查询数据库中信息
    try:
        user = User.query.filter_by(id=id).first()
    except Exception as e:
        current_app.logger.error(e)
        abort(400)
    content = {
        "user": user
    }
    
    # 3.返回信息到前端页面
    return render_template("index.html", content=content)

HTML代码：

这里使用的是前后端不分离的写法：

            {% if content.user %}
                <div class="user_login fr">
                    <img src="../static/news/images/person01.png" class="lgin_pic">
                    <a href="#">{{ content.user.nick_name }}</a>
                    <a href="#" onclick="logout()">退出</a>
                </div>
            {% else %}
                <div class="user_btns fr">
                    <a href="javascript:;" class="login_btn">登录</a> / <a href="javascript:;" class="register_btn">注册</a>
                </div>
            {% endif %}

退出相关：

将登出相关的视图函数都写在passport对应的views里

后端Flask代码：

from flask import jsonify, session
from info.response_code import RET
from . import blue_passport

@blue_passport.route("/logout", methods=["GET"])
def logout():
    """
        登出相关
        1.删除session信息
        2.返回结果
    :return:
    """
    session.pop("id", None)
    session.pop("mobile", None)
    session.pop("nickName", None)
    return jsonify(errno=RET.OK, errmsg="退出成功")

JS代码：

// 退出登录
function logout() {
    // $.ajax({
    //     url:'/passport/logout',
    //     type:'get'
    // });

    $.get('/passport/logout', function (response) {
        if (response.errno == '0') {
            // 退出登录成功
            location.reload();
        } else {
            alert(response.errmsg);
        }
    })
}