JavaScript游戏数据传入Flask数据库失败：Lamocoins增加异常排查

以下从前端请求、后端路由、数据库结构三个核心环节逐一排查问题，并给出针对性修复方案：

一、前端handleGameOver函数排查 #

前端常见问题：未正确发起请求、缺少CSRF验证、参数格式错误、未区分胜负状态。

错误示例（可能存在的问题） #

function handleGameOver() {
  // 未设置请求头、未序列化参数、无错误回调
  fetch('/gain_currency', {
    method: 'POST',
    body: { coins: 10 }
  });
}

修复后的代码 #

function handleGameOver(isWin) {
  // 仅获胜时触发加币逻辑
  if (!isWin) return;

  fetch('/gain_currency', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      // 必须携带Flask要求的CSRF Token
      'X-CSRFToken': getCookie('csrf_token')
    },
    body: JSON.stringify({
      amount: 10 // 需添加的Lamocoins数量
    })
  })
  .then(response => {
    if (!response.ok) throw new Error(`请求失败: ${response.status}`);
    return response.json();
  })
  .then(data => {
    console.log('加币成功，当前余额:', data.new_coins);
    // 可在此更新前端货币显示
  })
  .catch(error => {
    console.error('加币失败:', error);
  });
}

// 辅助函数：获取Cookie中的CSRF Token
function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}

二、后端/gain_currency路由排查 #

Flask路由常见问题：未指定POST方法、未解析JSON参数、未处理用户登录状态、数据库操作未提交。

错误示例（可能存在的问题） #

@app.route('/gain_currency')
def gain_currency():
    amount = request.form.get('amount')
    # 未获取当前用户ID、未提交数据库事务
    db.session.add(UserCoins(user_id=1, coins=amount))
    return "OK"

修复后的代码 #

from flask import Flask, request, jsonify, session
from models import db, UserCoins  # 替换为你的模型定义

@app.route('/gain_currency', methods=['POST'])
def gain_currency():
    # 验证用户登录状态
    if 'user_id' not in session:
        return jsonify({'success': False, 'message': '未登录'}), 401

    # 解析JSON格式的请求参数
    data = request.get_json()
    if not data or 'amount' not in data:
        return jsonify({'success': False, 'message': '缺少必要参数'}), 400

    try:
        amount = int(data['amount'])
        user_id = session['user_id']

        # 更新用户货币：存在则累加，不存在则新建
        user_coins = UserCoins.query.filter_by(user_id=user_id).first()
        if user_coins:
            user_coins.coins += amount
        else:
            user_coins = UserCoins(user_id=user_id, coins=amount)
            db.session.add(user_coins)
        
        db.session.commit()
        return jsonify({'success': True, 'new_coins': user_coins.coins})
    except Exception as e:
        db.session.rollback()
        return jsonify({'success': False, 'message': str(e)}), 500

三、数据库结构验证 #

结合你提供的数据库截图，需确认以下几点：

• 货币表（如user_coins）需包含user_id（关联用户表）和coins（存储货币数量）字段
• coins字段需设为整数类型（INT/BIGINT），避免浮点精度问题
• 需给user_id添加唯一索引，确保每个用户仅存在一条货币记录

示例建表语句（若结构有误可参考） #

CREATE TABLE user_coins (
    id INT AUTO_INCREMENT PRIMARY KEY,
    user_id INT NOT NULL,
    coins INT DEFAULT 0,
    FOREIGN KEY (user_id) REFERENCES users(id),
    UNIQUE KEY (user_id) -- 防止同一用户重复创建记录
);

四、快速调试步骤 #

1. 打开浏览器开发者工具（F12）→ 切换到Network标签，触发游戏结束，查看请求状态码、请求参数和响应内容
2. 在Flask后端添加日志，打印关键信息：

import logging
logging.basicConfig(level=logging.DEBUG)

@app.route('/gain_currency', methods=['POST'])
def gain_currency():
    logging.debug(f"请求参数: {request.get_json()}")
    logging.debug(f"当前登录用户ID: {session.get('user_id')}")
    # 后续代码...

3. 直接查询数据库，确认操作后coins字段是否更新

内容的提问来源于stack exchange，提问作者4l3sh4