从零开始写代码 2024-02-14 11:15 采纳率: 69.2%
浏览 8
已结题

Flask前端+pymysql登录项目

目的是想做一个完整的登录项目,但是出了一些很奇怪的bug

img

就是你输入信息之后,就只返回了一个服务器的信息如何也不打印‘注册成功’,也没有报错

img

点登录后,原网页也就刷新了一下

img

源码如下,不知道哪里错了

login.py


from flask import app,Flask,render_template,redirect,request
import pymysql
app=Flask(__name__)
@app.route('/login',methods=['GET','POST'])
def user_login():
    if request.method=='GET':
        return render_template('login.html')
    username = request.args.get('user')
    password = request.args.get('pwd')
    conn=pymysql.connect(host='localhost',user='root',password='123',charset='utf8',db='unicom')
    cursor=conn.cursor()
    cursor.execute('''
    CREATE TABLE IF NOT EXISTS info (
        id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,
        username VARCHAR(255) NOT NULL UNIQUE,
        password VARCHAR(255) NOT NULL
    )
    ''')
    try:
        cursor.execute("INSERT INTO info (username, password) VALUES (%s, %s)", (username, password))
        conn.commit()
        return '注册成功'
    except pymysql.Error as e:
        print(f"Error: {e}")
        return str(e)
    finally:
        cursor.close()
        conn.close()

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

login.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css" integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">
    <style>
        .account {
            width: 500px;
            height: 350px;
            border: 1px solid #dddddd;
            border-radius: 7px;
            margin-left: auto;
            margin-right: auto;
            margin-top: 200px;
            padding: 10px 50px;
            box-shadow: 5px 5px 5px #aaaaaa;
        }

        .account h2 {
            text-align: center;
        }
    </style>
</head>

<body>
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <!-- Brand and toggle get grouped for better mobile display -->
            <div class="navbar-header">
                <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="#">XX导航</a>
            </div>

            <!-- Collect the nav links, forms, and other content for toggling -->
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class="nav navbar-nav">
                    <li class="active"><a href="#">Link <span class="sr-only">(current)</span></a></li>
                    <li><a href="#">Link</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                            aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">One more separated link</a></li>
                        </ul>
                    </li>
                </ul>
                <form class="navbar-form navbar-left">
                    <div class="form-group">
                        <input type="text" class="form-control" placeholder="Search">
                    </div>
                    <button type="submit" class="btn btn-default">Submit</button>
                </form>
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="#">Link</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                            aria-expanded="false">Dropdown <span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Action</a></li>
                            <li><a href="#">Another action</a></li>
                            <li><a href="#">Something else here</a></li>
                            <li role="separator" class="divider"></li>
                            <li><a href="#">Separated link</a></li>
                        </ul>
                    </li>
                </ul>
            </div><!-- /.navbar-collapse -->
        </div><!-- /.container-fluid -->
    </nav>
    <div class="account">
        <h2 class="strong">用户登录</h2>
        <form>
            <form>
                <div class="form-group">
                    <label for="exampleInputEmail1">用户名</label>
                    <input type="email" name="user" class="form-control" id="exampleInputEmail1" placeholder="请输入用户名">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">密码</label>
                    <input type="password" name="pwd" class="form-control" id="exampleInputPassword1" placeholder="密码">
                </div>
                <div>
                    <label for="exampleInputPassword1">图片验证码</label>
                    <input type="text" class="form-control" placeholder="请输入图片验证码">
                </div>
                <br>
                <button type="submit" class="btn btn-primary">登 录</button>
            </form>
    </div>
    
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>
    
</body>

</html>

  • 写回答

4条回答 默认 最新

  • 专家-赤兔[在线] 优质创作者: 编程框架技术领域 2024-02-14 11:16
    关注

    引自免费微信小程序:皆我百晓生

    在分析您的问题之前,请允许我指出您提供的代码中存在的一些关键性错误和逻辑问题,这可能是导致“注册成功”信息未显示以及页面刷新无响应的原因。

    问题1:路由处理逻辑 根据login.py中的代码,您似乎将登录和注册功能混合在一个路由里了。实际上,这个路由应当是处理用户登录验证而非注册新用户。当用户通过表单提交用户名和密码时,它尝试创建数据库表(如果不存在)并插入新的用户数据,而不是验证已存在的用户信息。

    问题2:请求方法与参数获取 在Flask中,对于POST请求,应使用request.form来获取表单字段的值,而不是request.args.get(),因为request.args.get()用于从查询字符串获取GET请求的参数。

    问题3:HTML表单提交方式 您的HTML表单没有指定action属性和method属性,这意味着默认情况下会发送GET请求,并且目标URL将是当前页面。为了实现登录功能,您需要将表单设置为POST请求,并指向正确的路由。

    针对上述问题,对代码进行如下修正:

    首先,修改login.py以处理登录验证而非注册:

    from flask import Flask, render_template, redirect, request
    import pymysql
    
    app = Flask(__name__)
    
    @app.route('/login', methods=['GET', 'POST'])
    def user_login():
        if request.method == 'GET':
            return render_template('login.html')
    
        # 获取POST请求中的用户名和密码
        username = request.form.get('user')
        password = request.form.get('pwd')
    
        # 连接数据库并执行登录验证(这里假设你有一个验证用户是否存在及密码是否匹配的SQL查询)
        # 以下仅为示例,实际验证逻辑请替换
        conn = pymysql.connect(host='localhost', user='root', password='123', charset='utf8', db='unicom')
        cursor = conn.cursor()
        
        try:
            # 假设有个查询语句来验证用户凭据
            query = "SELECT * FROM info WHERE username=%s AND password=%s"
            cursor.execute(query, (username, password))
            
            # 如果查询结果有记录,则验证成功,返回'登录成功'
            if cursor.fetchone() is not None:
                return '登录成功'
    
            # 否则,返回提示信息或重定向到错误页面
            else:
                return '用户名或密码错误'
    
        except pymysql.Error as e:
            print(f"Error: {e}")
            return str(e)
    
        finally:
            cursor.close()
            conn.close()
    
    if __name__ == '__main__':
        app.run()
    

    其次,更新login.html表单部分,使其发送POST请求至 /login 路由:

    <form method="post" action="/login">
        <!-- ... 表单内容不变 ... -->
        <button type="submit" class="btn btn-primary">登 录</button>
    </form>
    

    注意:以上修复仅解决了请求方法、参数获取和路由逻辑的问题,但并未提供完整的登录验证功能。您需要根据实际数据库结构和业务需求完善登录验证部分的SQL查询。此外,对于生产环境,强烈建议使用预编译SQL语句防止SQL注入攻击,例如使用pymysql的cursor.execute()方法的参数化查询。

    评论

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 5月20日
  • 创建了问题 2月14日