时间戳

首页 > 解决方案 > 使用 Flask 将 HTML 登录代码与 apps.py Python 代码链接时出现问题

python - 使用 Flask 将 HTML 登录代码与 apps.py Python 代码链接时出现问题

问题描述

我有这个在导航栏中运行的代码，它旨在实现登录/注册表单，但无需离开主页，它是一个带有 data-target="#login-form" 的切换器：

<a href="#" data-toggle="modal" data-target="#login-form" class="c-btn-border-opacity-04 c-btn btn-no-focus c-btn-header btn btn-sm c-btn-border-1x c-btn-dark c-btn-circle c-btn-uppercase c-btn-sbold"><i class="icon-user"></i> Sign In</a>

如何更改 @app.route 以使其针对在主页内实现的登录表单？使用的 Python 代码：

@app.route('/')
def home():
    # Check if user is loggedin
    if 'loggedin' in session:
    
        # User is loggedin show them the home page
        return render_template('home.html', username=session['username'])
    # User is not loggedin redirect to login page
    return redirect(url_for('home'))
 
@app.route('/login/', methods=['GET', 'POST'])
def login():
    cursor = conn.cursor(cursor_factory=psycopg2.extras.DictCursor)
   
    # Check if "username" and "password" POST requests exist (user submitted form)
    if request.method == 'POST' and 'username' in request.form and 'password' in request.form:
        username = request.form['username']
        password = request.form['password']
        print(password)
 
        # Check if account exists using MySQL
        cursor.execute('SELECT * FROM users WHERE username = %s', (username,))
        # Fetch one record and return result
        account = cursor.fetchone()
 
        if account:
            password_rs = account['password']
            print(password_rs)
            # If account exists in users table in out database
            if check_password_hash(password_rs, password):
                # Create session data, we can access this data in other routes
                session['loggedin'] = True
                session['id'] = account['id']
                session['username'] = account['username']
                # Redirect to home page
                return redirect(url_for('home'))
            else:
                # Account doesnt exist or username/password incorrect
                flash('Incorrect username/password')
        else:
            # Account doesnt exist or username/password incorrect
            flash('Incorrect username/password')
 
    return render_template('home.html')

<div class="modal fade c-content-login-form" id="login-form" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content c-square">
            <div class="modal-header c-no-border">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            </div>
            <div class="modal-body">
                <h3 class="c-font-24 c-font-sbold">Good Afternoon!</h3>
                <p>Let's make today a great day!</p>
                <form>
                    <div class="form-group" method="post">
                        <label for="username" class="hide">Username</label>
                        <input type="username" class="form-control input-lg c-square" name="username"  id="username" placeholder="Username">
                    </div>
                    <div class="form-group">
                        <label for="password" class="hide">Password</label>
                        <input type="password" class="form-control input-lg c-square" name="password" id="password" placeholder="Password">
                    </div>
                    <div class="form-group">
                        <div class="c-checkbox">
                            <input type="checkbox" id="login-rememberme" class="c-check">
                            <label for="login-rememberme" class="c-font-thin c-font-17">
                                <span></span>
                                <span class="check"></span>
                                <span class="box"></span>
                                Remember Me
                            </label>
                        </div>
                    </div>
                    <div class="form-group">
                        <input type="submit" value="Login" class="form-control btn btn-success btn c-theme-btn btn-md c-btn-uppercase c-btn-bold c-btn-square c-btn-login" name="">Login</input>
                        <a href="javascript:;" data-toggle="modal" data-target="#forget-password-form" data-dismiss="modal" class="c-btn-forgot">Forgot Your Password ?</a>
                    </div>
                    <div class="clearfix">
                        <div class="c-content-divider c-divider-sm c-icon-bg c-bg-grey c-margin-b-20">
                            <span>or signup with</span>
                        </div>
                        <ul class="c-content-list-adjusted">
                            <li>
                                <a class="btn btn-block c-btn-square btn-social btn-twitter">
                                  <i class="fa fa-twitter"></i>
                                  Twitter
                                </a>
                            </li>
                            <li>
                                <a class="btn btn-block c-btn-square btn-social btn-facebook">
                                  <i class="fa fa-facebook"></i>
                                  Facebook
                                </a>
                            </li>
                            <li>
                                <a class="btn btn-block c-btn-square btn-social btn-google">
                                  <i class="fa fa-google"></i>
                                  Google
                                </a>
                            </li>
                        </ul>
                    </div>
                </form>

我了解链接特定页面，但如果它不完全是您要链接的页面怎么办

标签： pythonhtmlsqlflask

解决方案

这是我在同一条路线上拥有登录表单和主页的方法（可能使用两个模板，但这也有效）：

主文件：

from flask import Flask, redirect, url_for, request, render_template
from wtforms import StringField, SubmitField
from wtforms.validators import InputRequired
from flask_wtf import FlaskForm


app = Flask(__name__)
app.config['SECRET_KEY'] = 'your_key_'
user_logged_in = False


class LoginForm(FlaskForm):
    username = StringField('Username', validators=[InputRequired()])
    password = StringField('Password', validators=[InputRequired()])
    submit = SubmitField('Login')


@app.route('/', methods=['GET', 'POST'])
def home():
    global user_logged_in
    if user_logged_in:
        return render_template('home.html', logged_in=user_logged_in)
    else:
        form = LoginForm()
        if form.validate_on_submit():
            user_logged_in = True
            return redirect(url_for('home'))
        return render_template('home.html', logged_in=user_logged_in, form=form)


if __name__ == '__main__':
    app.run(debug=True)

显然你需要使用你的用户登录验证，这只是为了测试（logged_in变量）
（我花了大约 20 分钟试图弄清楚为什么我不能提交表单，这是因为我没有包含{{ form.hidden_tag() }}在我的表单中）

模板（超级简单）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Home</title>
</head>
<body>

{% if logged_in %}

<h1>You are logged in</h1>
<p>{{ logged_in }}</p>

{% else %}

<form action="{{ url_for('home') }}" method="POST">
    {{ form.hidden_tag() }}
    <div>
        {{ form.username.label }}
        {{ form.username }}
    </div>
    <div>
        {{ form.password.label }}
        {{ form.password }}
    </div>
    {{ form.submit }}
</form>

<p>{{ logged_in }}</p>

{% endif %}

</body>
</html>

基本上，您检查用户是否已登录，然后只需将该变量传递给模板，并且有一个巨大的 if 语句，我应该指出，在这种情况下使用模式不是最好的主意，您必须完全显示只有登录部分，否则有人可能会打开 DevTools 并删除该模式并获得对主页的访问权限

如果您有任何问题，请询问

推荐阅读