设为首页收藏本站
切换到窄版

鱼C论坛

 找回密码
 立即注册
鱼C论坛»论坛 › 技术交流 › 新手乐园 › 最近准备搞个B/S 程序
1234
返回列表 发新帖
楼主: wp231957

[已解决]最近准备搞个B/S 程序

[复制链接]
wp231957
 楼主| 发表于 2024-3-8 09:54:55 | 显示全部楼层
FishC 发表于 2024-3-8 09:13
你是对的，前端目前无法直接知道注册是否成功。为了让前端能够得到注册结果，你可以在后端返回一个表示 ...

问题焦点：
#游客注册账户
@app.route('/zhuce', methods=['POST'])
def zhuce():
    # 获取前端发送的数据
    username = request.form.get('username')
    password = request.form.get('password')
    # 连接 MySQL 数据库
    db = pymysql.connect(host='127.0.0.1', user='root', password='123456', database='gzcx')
    print(db)
    # 创建一个游标对象
    cursor = db.cursor()
    # 执行SQL语句
    sql = "insert into person (xm,pwd,shenfen,gh) values ('"+username+"','"+password+"','B','0011');"
    print(sql)
    cursor.execute(sql)
    # 提交事务
    db.commit()
    cursor.close()
    db.close()
    err={"message":"注册成功"}
    return err
后台这里，数据库部分没问题，能够存储到表里，但是这个err 前端接收不到，
服务器莫名其妙的多了一条 127.0.0.1 - - [08/Mar/2024 09:45:32] "GET /register?username=wp231957&password=123&qrmm=123 HTTP/1.1" 200

附前端代码：
<body>
    <div>
        <label id="flag"></label> 当前登录用户: <label id="yonghu">{{data.yonghu}}</label> 当前登录用户权限: <label id="yhqx">{{data.yhqx}}</label>
    </div>
    <h2>用户注册</h2>
    <form id="zhuce">
        <label for="username">用户名:</label>
        <input type="text" id="username" name="username" required><br><br>
        <label for="password">密码:</label>
        <input type="password" id="password" name="password" required><br><br>
        <label for="qrmm">确认密码:</label>
        <input type="password" id="qrmm" name="qrmm" required><br><br>
        <button onclick="zhuce()">注册</button>
    </form>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li><a href="/main">返回主菜单</a></li>
    </ul>
    <script>
        function zhuce() {
            var username = document.getElementById('username').value;
            var password = document.getElementById('password').value;
            var qrmm = document.getElementById('qrmm').value;
            //alert(password,qrmm);
            // 判断密码和确认密码是否一致
            if (password !== qrmm) {
                alert("两次输入的密码不一致");
                return;
            }

            // 创建FormData对象，用于存储待发送的表单数据
            var formData = new FormData();
            formData.append('username', username);
            formData.append('password', password);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/zhuce', true);
            xhr.send(formData);

            xhr.onload = function() {
                if (xhr.status === 200) {
                    var response = JSON.parse(xhr.responseText);
                    alert(response.message);  // 弹出注册成功的提示框
                    // 其他操作，如跳转到登录页面
                } else {
                    alert("注册失败");  // 弹出注册失败的提示框
                }
            };
        }
    </script>
</body>
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 09:55:17 | 显示全部楼层
wp231957 发表于 2024-03-08 09:54
问题焦点：
#游客注册账户
@app.route('/zhuce', me ...


根据你提供的代码，你在前端使用了`xhr.open('POST', '/zhuce', true)`来发送POST请求，而在后端的Flask应用中使用了`@app.route('/zhuce', methods=)`来定义注册路由。这是一致的，应该没问题。

然而，根据你提供的后端代码，你将注册成功的信息存储在了一个名为`err`的字典中，并返回给前端。但是，根据你的描述，前端却无法接收到这个信息。原因可能是字典的命名问题。

请将`err`字典改为`result`字典，并在其中添加一个键值对，如：`result = {'message': '注册成功'}`。然后，将`result`字典作为参数传递给`jsonify()`函数，如：`return jsonify(result), 200`。以下是修改后的后端代码示例：

  1. from flask import Flask, request, jsonify
  2. import pymysql

  4. app = Flask(__name__)

  6. @app.route('/zhuce', methods=['POST'])
  7. def zhuce():
  8.     # 获取前端发送的数据
  9.     username = request.form.get('username')
  10.     password = request.form.get('password')

  12.     # 连接 MySQL 数据库
  13.     db = pymysql.connect(host='127.0.0.1', user='root', password='123456', database='gzcx')
  14.     print(db)

  16.     # 创建一个游标对象
  17.     cursor = db.cursor()

  19.     # 执行SQL语句
  20.     sql = "insert into person (xm,pwd,shenfen,gh) values ('"+username+"','"+password+"','B','0011');"
  21.     print(sql)
  22.     cursor.execute(sql)

  24.     # 提交事务
  25.     db.commit()

  27.     cursor.close()
  28.     db.close()

  30.     result = {'message': '注册成功'}
  31.     return jsonify(result), 200

  33. if __name__ == '__main__':
  34.     app.run()
复制代码


请尝试修改后端代码，并重新运行程序。然后，测试一下前端是否能够接收到注册成功的信息。如果还有其他问题，请告诉我。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
 楼主| 发表于 2024-3-8 09:59:31 | 显示全部楼层
FishC 发表于 2024-3-8 09:55
根据你提供的代码，你在前端使用了`xhr.open('POST', '/zhuce', true)`来发送POST请求，而在后端的Flas ...

不行的，故障依旧，
查看数据库  会发现  记录已经被成功添加，
前端浏览器地址栏  多了 http://127.0.0.1:8888/register?u ... rd=123&qrmm=123
这个不是表单的提交信息吗   可是我前端代码里没有直接用form提交的啊
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 09:59:47 | 显示全部楼层
wp231957 发表于 2024-03-08 09:59
不行的，故障依旧，
查看数据库  会发现  记录已经被 ...


根据你的描述，看起来你的前端代码中使用了GET请求而不是POST请求来提交表单数据。在代码中`xhr.open('POST', '/zhuce', true);`应该改为`xhr.open('GET', '/zhuce?username=' + username + '&password=' + password, true);`并且将`formData`部分删除。这样就可以通过URL参数的方式将用户名和密码传递给后端。

修改后的前端代码示例：
  1. function zhuce() {
  2.     var username = document.getElementById('username').value;
  3.     var password = document.getElementById('password').value;
  4.     var qrmm = document.getElementById('qrmm').value;

  6.     // 判断密码和确认密码是否一致
  7.     if (password !== qrmm) {
  8.         alert("两次输入的密码不一致");
  9.         return;
  10.     }

  12.     var xhr = new XMLHttpRequest();
  13.     xhr.open('GET', '/zhuce?username=' + username + '&password=' + password, true);
  14.     xhr.send();

  16.     xhr.onload = function() {
  17.         if (xhr.status === 200) {
  18.             var response = JSON.parse(xhr.responseText);
  19.             alert(response.message);  // 弹出注册成功的提示框
  20.             // 其他操作，如跳转到登录页面
  21.         } else {
  22.             alert("注册失败");  // 弹出注册失败的提示框
  23.         }
  24.     };
  25. }
复制代码


请尝试修改前端代码并重新测试。如果问题仍然存在，请提供完整的前端和后端代码以便排查问题。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
 楼主| 发表于 2024-3-8 13:22:28 | 显示全部楼层
FishC 发表于 2024-3-8 09:59
根据你的描述，看起来你的前端代码中使用了GET请求而不是POST请求来提交表单数据。在代码中`xhr.open(' ...

前端是用json 发过来的数据

后端该如何接收（python+flask）
if request.method == 'POST':     
        username = request.form.get('username')        
        password = request.form.get('password')  
        print(username,password)         
这样接收不到，因为前端不是用表单发过来的
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 13:22:42 | 显示全部楼层
wp231957 发表于 2024-03-08 13:22
前端是用json 发过来的数据

后端该如何接收（pytho ...


如果前端是使用JSON格式发送数据到后端，你可以通过Flask的`request.json`属性来接收JSON数据。修改你的代码如下所示：

  1. from flask import Flask, request
  2. import json

  4. app = Flask(__name__)

  6. @app.route('/zhuce', methods=['POST'])
  7. def zhuce():
  8.     data = request.get_json()
  9.     username = data.get('username')
  10.     password = data.get('password')
  11.     print(username, password)

  13.     # 其他处理逻辑

  15.     return json.dumps({'message': '注册成功'})

  17. if __name__ == '__main__':
  18.     app.run()
复制代码


上述代码中，`request.get_json()`方法用于获取前端发送的JSON数据，并返回一个Python字典对象。然后，你可以通过键来获取相应的值。

希望这样能够帮助你正确地接收前端发送过来的JSON数据。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
 楼主| 发表于 2024-3-8 18:01:39 | 显示全部楼层
FishC 发表于 2024-3-8 13:22
如果前端是使用JSON格式发送数据到后端，你可以通过Flask的`request.json`属性来接收JSON数据。修改你 ...

这里有一段 可以正确运行的  游客注册  代码
现在的需求是，再正式注册之前 要插入一段  验证username 是否已经再数据库里  如果不在，继续运行
后面的程序，如果已存在，要把程序切回到前台，这该是什么逻辑呢

#游客注册账户
@app.route('/zhuce', methods=['POST'])
def zhuce():
    # 获取前端发送的数据
    username = request.form.get('username')
    password = request.form.get('password')
    password=strtomd5(password)
    # 连接 MySQL 数据库
    db = pymysql.connect(host='127.0.0.1', user='root', password='123456', database='gzcx')
    print(db)
    # 创建一个游标对象
    cursor = db.cursor()
   
    # 执行SQL语句
    sql = "insert into person (xm,pwd,shenfen,gh) values ('"+username+"','"+password+"','B','0011');"
    print(sql)
    cursor.execute(sql)
    # 提交事务
    db.commit()
    cursor.close()
    db.close()
    result = {'message': '注册成功'}
    return jsonify(result), 200
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 18:02:11 | 显示全部楼层
wp231957 发表于 2024-03-08 18:01
这里有一段 可以正确运行的  游客注册  代码
现在的 ...


要实现在游客注册时验证用户名是否存在的逻辑，可以使用以下代码示例：

  1. import pymysql
  2. from flask import Flask, request, jsonify

  4. app = Flask(__name__)

  6. @app.route('/zhuce', methods=['POST'])
  7. def zhuce():
  8.     # 获取前端发送的数据
  9.     username = request.form.get('username')
  10.     password = request.form.get('password')
  11.     # 连接 MySQL 数据库
  12.     db = pymysql.connect(host='127.0.0.1', user='root', password='123456', database='gzcx')
  13.     # 创建一个游标对象
  14.     cursor = db.cursor()
  15.    
  16.     # 查询该用户名是否已存在
  17.     select_sql = "SELECT * FROM person WHERE xm = %s"
  18.     cursor.execute(select_sql, username)
  19.     result = cursor.fetchone()  # 如果存在，fetchone()会返回非空结果
  20.    
  21.     if result:
  22.         # 用户名已存在，返回错误提示
  23.         response = {'message': '用户名已存在'}
  24.         return jsonify(response), 400
  25.    
  26.     # 用户名不存在，继续执行后续注册逻辑
  27.     password = strtomd5(password)
  28.     insert_sql = "INSERT INTO person (xm, pwd, shenfen, gh) VALUES (%s, %s, 'B', '0011')"
  29.     cursor.execute(insert_sql, (username, password))
  30.     # 提交事务
  31.     db.commit()
  32.    
  33.     cursor.close()
  34.     db.close()
  35.     response = {'message': '注册成功'}
  36.     return jsonify(response), 200

  38. if __name__ == '__main__':
  39.     app.run()
复制代码


上述代码在注册时先查询数据库，检查用户名是否已存在。如果存在，则返回错误提示信息；如果不存在，则继续执行注册逻辑并插入数据到数据库中。注意在查询时使用了参数化查询，以防止SQL注入的安全问题。希望这样能够满足你的需求。

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
 楼主| 发表于 2024-3-8 18:16:41 | 显示全部楼层
FishC 发表于 2024-3-8 18:02
要实现在游客注册时验证用户名是否存在的逻辑，可以使用以下代码示例：

请问，这段程序是否有问题，
我演示了很多次游客注册模块，只有一次没有弹窗提示   其余99%  都能正确弹窗
这是bug吗  还是模块写法有问题  还是逻辑问题

<script>
        function zhuce() {
            var username = document.getElementById('username').value;
            var password = document.getElementById('password').value;
            var qrmm = document.getElementById('qrmm').value;
            //alert(password,qrmm);
            // 判断密码和确认密码是否一致
            if (password !== qrmm) {
                alert("两次输入的密码不一致");
                return;
            }

            // 创建FormData对象，用于存储待发送的表单数据
            var formData = new FormData();
            formData.append('username', username);
            formData.append('password', password);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/zhuce', true);
            xhr.send(formData);

            xhr.onload = function() {
                if (xhr.status === 200) {
                    var response = JSON.parse(xhr.responseText);
                    alert(response.message);  // 弹出注册成功的提示框
                    // 其他操作，如跳转到登录页面
                } else {
                    alert("注册失败");  // 弹出注册失败的提示框
                }
            };
        }
    </script>
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 18:17:00 | 显示全部楼层
wp231957 发表于 2024-03-08 18:16
请问，这段程序是否有问题，
我演示了很多次游客注册 ...


从你提供的代码来看，前端部分似乎没有明显的问题。但是，在某些情况下可能会导致没有弹出提示框。

其中一个可能的问题是，你在服务端返回的响应中没有设置正确的HTTP状态码。在你的Python代码中，当用户名已存在时，应该返回状态码400（即请求错误），而不是200。你可以修改如下代码：

  1. if result:
  2.     # 用户名已存在，返回错误提示
  3.     response = {'message': '用户名已存在'}
  4.     return jsonify(response), 400
复制代码


另外一个可能的问题是，浏览器的缓存。有时候在同一个页面重复注册时，浏览器会缓存上一次的请求结果，导致无法正确弹出提示框。你可以尝试清除浏览器的缓存，或者在每次注册后刷新页面，以确保获取最新的响应数据。

如果以上两点都没有解决你的问题，建议你检查浏览器的控制台或网络面板，查看是否有其他错误信息。

总之，要排除这个问题，你需要确保在用户名已存在时返回正确的HTTP状态码，并确保浏览器没有缓存旧的响应结果。希望能帮到你！

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

wp231957
 楼主| 发表于 2024-3-8 18:28:22 | 显示全部楼层
FishC 发表于 2024-3-8 18:17
从你提供的代码来看，前端部分似乎没有明显的问题。但是，在某些情况下可能会导致没有弹出提示框。

...

在做文件上传的模块时，需要验证用户的权限   普通用户  不能上传文件
这个验证是在前端做呢，还是在后台做呢

这是前端代码：
<!DOCTYPE html>
<html>
<head>
    <title>文件上传</title>
    <!-- 这里可以引入一些 CSS 文件来美化页面样式 -->
</head>
<body>
    <div>
        <label id="flag"></label> 当前登录用户: <label id="yonghu">{{data.yonghu}}</label> 当前登录用户权限: <label id="yhqx">{{data.yhqx}}</label>
    </div>
    <h1>文件上传</h1>
    <form id="uploadForm" enctype="multipart/form-data">
        <input type="file" id="fileInput">
        <button type="button" onclick="uploadFile()">上传</button>
    </form>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li><a href="/main">返回主菜单</a></li>
    </ul>

    <script>
        function uploadFile() {
            var fileInput = document.getElementById('fileInput');
            var file = fileInput.files[0];
            
            var formData = new FormData();
            formData.append('file', file);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/upload', true);
            xhr.onload = function () {
                if (xhr.status === 200) {
                    console.log('文件上传成功');
                } else {
                    console.log('文件上传失败');
                }
            };
            xhr.send(formData);
        }
    </script>
</body>
</html>
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

FishC
发表于 2024-3-8 18:28:34 | 显示全部楼层
wp231957 发表于 2024-03-08 18:28
在做文件上传的模块时，需要验证用户的权限   普通用 ...


验证用户权限应该在后端进行。前端代码只是一个用户界面，用户可以触发上传操作，但实际的权限检查需要在服务端进行。在后端代码中，你可以在文件上传接口（`/upload`）中添加一个权限验证的逻辑。例如，你可以在用户登录时将用户权限信息保存在Session中，在文件上传接口中判断当前用户的权限是否允许上传文件。如果权限满足要求，则继续处理文件上传逻辑；如果权限不满足要求，则返回相应的错误信息。下面是一个示例代码片段：
  1. flask import session, request@app.route('/upload', methods=['POST'])def upload():    # 验证用户权限    yhqx = session.get('yhqx')    if not yhqx or yhqx != '管理员':        return '无上传权限', 403    # 处理文件上传逻辑    file = request.files.get('file')    if file:        # 文件上传成功的处理逻辑        return '文件上传成功'    else:        # 文件上传失败的处理逻辑        return '文件上传失败'
复制代码
这段代码假设你在登录时将用户权限信息存储在Session中，并且权限字段名称为`yhqx`。在文件上传接口中，根据`yhqx`字段判断用户权限是否允许上传文件。当用户权限不满足要求时，返回状态码403和相应的错误提示；当用户权限满足要求并且文件上传成功时，返回状态码200和成功信息。这样，前端代码中的`xhr.onload`函数可以根据状态码进行相应的处理，例如输出日志。希望以上信息对你有所帮助！

以上回复来自 FishC AI 小助理，如未能正确解答您的问题，请继续追问。
想知道小甲鱼最近在做啥？请访问 -> ilovefishc.com
回复 支持 反对

使用道具 举报

1234
返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

小黑屋|手机版|Archiver|鱼C工作室 ( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)

GMT+8, 2024-5-3 22:26

Powered by Discuz! X3.4

© 2001-2023 Discuz! Team.

快速回复 返回顶部 返回列表