解决Flask Blueprint中动态URL段与前端Fetch请求路径问题

from flask import Blueprint, request, jsonify
from flask_login import login_required # 假设存在登录验证，可根据实际情况移除

bp = Blueprint('main', __name__)

@bp.route('/<int:strategy_id>/add_indicator', methods=['POST'])
@login_required
def add_indicator(strategy_id):
    """
    处理添加指标的POST请求，接收URL中的strategy_id。
    """
    if request.method == 'POST':
        print(f"接收到 strategy_id: {strategy_id}")
        data = request.get_json()
        # 实际业务逻辑：根据strategy_id和data添加指标
        return jsonify({"status": "success", "strategy_id": strategy_id, "received_data": data})
    return jsonify({"status": "error", "message": "Method not allowed"}), 405

@bp.route('/<int:id>/load_conditions', methods=['POST'])
def load_conditions(id):
    """
    加载条件的POST请求，接收URL中的id。
    """
    print(f"接收到 ID: {id}")
    # 实际业务逻辑：根据id加载条件
    # 假设返回一些模拟数据
    return jsonify({"sell_conds": ["cond1", "cond2"], "buy_conds": ["condA", "condB"]})

# 假设应用程序的入口点（例如 app.py）注册了此蓝图
# app.register_blueprint(bp)

// 错误示例：使用绝对路径
let indi_data = await postJsonGetData(data, "/add_indicator");

// 正确示例：使用相对路径
const { sell_conds, buy_conds } = await getJson("load_conditions");

// 修正后的代码：使用相对路径
let indi_data = await postJsonGetData(data, "add_indicator");

// 辅助函数：发送JSON数据并获取响应
async function postJsonGetData(data, endpoint, method = "POST") {
  const options = {
    method: method,
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify(data),
  };
  let response = await fetch(endpoint, options);

  if (!response.ok) {
    const errorText = await response.text();
    throw new Error(`请求失败，状态码 ${response.status}: ${errorText}`);
  }

  const responseData = await response.json();
  return responseData;
}

// 辅助函数：获取JSON数据 (示例中是POST，实际GET请求无需body)
async function getJson(endpoint) {
  const options = {
    method: "POST", // 示例中是POST，如果后端是GET，此处应改为"GET"且移除body
    headers: {
      "Content-Type": "application/json",
    },
  };
  let response = await fetch(endpoint, options);

  if (!response.ok) {
    const errorText = await response.text();
    throw new Error(`请求失败，状态码 ${response.status}: ${errorText}`);
  }

  const responseData = await response.json();
  console.log(responseData, "Fetched Data");
  return responseData;
}

// 模拟在页面加载或某个事件触发时调用
async function fetchDataForStrategy() {
  // 假设当前页面URL是 /2/updatestrat
  // 可以通过 window.location.pathname 获取当前路径，并解析出ID
  const currentPathSegments = window.location.pathname.split('/');
  // 确保路径结构符合预期，例如 '/ID/something'
  const strategyIdFromUrl = currentPathSegments.length > 1 ? currentPathSegments[1] : '未知ID';

  console.log(`当前策略ID (从URL获取): ${strategyIdFromUrl}`);

  // 示例1: 获取条件 (使用相对路径，工作正常)
  try {
    const { sell_conds, buy_conds } = await getJson("load_conditions");
    console.log("加载条件成功:", { sell_conds, buy_conds });
  } catch (error) {
    console.error("加载条件失败:", error);
  }

  // 示例2: 添加指标 (修正后，使用相对路径)
  try {
    const indicatorData = { name: "RSI", params: { period: 14 } };
    // 关键修正：endpoint改为 "add_indicator" (相对路径)
    let indi_data = await postJsonGetData(indicatorData, "add_indicator");
    console.log("添加指标成功:", indi_data);
  } catch (error) {
    console.error("添加指标失败:", error);
  }
}

// 在实际应用中，你会在页面加载完成或用户交互时调用 fetchDataForStrategy()
// 例如：document.addEventListener('DOMContentLoaded', fetchDataForStrategy);