React集成Stripe结账时出现POST 404 Not Found错误排查求助

点击跳转至Stripe的按钮后，收到错误提示：

POST http://localhost:5000/api/v1/bookings/checkout-session/65a6c04df12519008999688c 404 (Not Found) bookingHandler @ SidePanel.jsx:9

已尝试修改路由、检查控制器代码，但问题仍未解决。

前端bookingHandler代码 #

const bookingHandler = async () => {
        try{
            const response = await fetch(
                `${BASE_URL}/bookings/checkout-session/${mechanicId}`,
                {
                    method: "post",
                    headers: {Authorization: `Bearer ${token} `,},
                }
            );
            const data = await response.json();
            if (data.session.url) {
                window.location.href = data.session.url;
            }
        } catch (err) {
            console.log(err.message)
        }
    }

后端bookingController部分代码（EDIT1补充） #

export const getCheckoutSession = async (req, res) => {
    try {
        const stripe = new Stripe(process.env.STRIPE_SECRET_KEY);
        // 获取当前预约的技师
        const mechanic = await Mechanic.findById(req.params.mechanicId);
        const user = await User.findById(req.userId);

        // 创建支付会话
        const session = await stripe.checkout.sessions.create({
            payment_method_types: ["card"],
            mode: "payment",
            success_url: `${process.env.CLIENT_SITE_URL}/checkout-success`,
            cancel_url: `${req.protocol}://${req.get("host")}/mechanic/${mechanic.id}`,
            customer_email: user.email,
            client_reference_id: req.params.mechanicId,
            line_items: [
                {
                    price_data: {
                        currency: "pln",
                        unit_amount: mechanic.price * 100,
                        product_data: {
                            name: mechanic.name,
                            description: mechanic.bio,
                            images: [mechanic.photo],
                        },
                    },
                    quantity: 1,
                },
            ],
        });

• 核对后端路由配置
  确认后端是否正确注册了POST /api/v1/bookings/checkout-session/:mechanicId路由：

  • 检查路由文件是否将getCheckoutSession控制器与该POST路由绑定
  • 确认路由前缀是否包含/api/v1，前端请求URL带该前缀，后端路由如果遗漏会直接404
  • 验证路由参数名是否一致，后端用req.params.mechanicId，路由中参数必须写为:mechanicId

• 检查请求方法一致性
  前端用method: "post"，务必确认后端路由对应的请求方法是POST，不要误写成GET（部分Stripe教程用GET，但这里必须和前端请求方法匹配）

• 验证BASE_URL的正确性
  打印BASE_URL的值，确认它是http://localhost:5000/api/v1还是http://localhost:5000：

  • 如果BASE_URL已包含/api/v1，前端请求URL会变成/api/v1/api/v1/bookings/...，导致路径错误

• 查看后端服务器日志
  启动后端服务时查看控制台，确认路由注册的输出信息；发送请求后，检查是否有请求到达后端的日志：

  • 如果没有日志，说明请求未到达后端，可能是跨域、端口不匹配或前端请求路径错误

• 补全控制器响应逻辑
  你提供的后端代码片段缺少响应返回，getCheckoutSession函数末尾需要添加：

  res.status(200).json({ session });
  

  这不是404的直接原因，但会导致前端后续跳转逻辑失效

• 测试裸请求
  用Postman或curl直接发送POST请求到http://localhost:5000/api/v1/bookings/checkout-session/65a6c04df12519008999688c，带上正确的Authorization头：

  • 如果返回404，说明后端路由确实未配置到位
  • 如果返回其他错误，说明路由存在但业务逻辑有问题

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