Nextjs集成Stripe支付：多商品结账添加图片报400错误

问题根源 #

Stripe Checkout的product_data.images字段要求传入字符串数组，你当前代码里直接把单个图片URL（字符串类型）赋值给images，不符合API参数格式，因此触发400状态码的"invalid array"错误。

修复代码 #

修改product_data中的images赋值，将单个URL包装成数组：

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse
) {
  if (req.method === "POST") {
    try {
      let requestArray = req.body;
      var result = requestArray.map((ele: any) => ({
        price_data: {
          currency: "usd",
          unit_amount: Number(ele.price) * 100,
          product_data: {
            name: ele.name,
            // 修复：将单个URL转为数组格式
            images: [ele.imageURL]
          },
        },
        quantity: ele.qty,
      }));

      const session = await stripe.checkout.sessions.create({
        line_items: result,
        mode: "payment",
        success_url: `${req.headers.origin}/checkout?success=true`,
        cancel_url: `${req.headers.origin}/checkout?canceled=true`,
      });

      res.json({ id: session.id });
    } catch (err: any) {
      res.status(err.statusCode || 500).json(err.message);
    }
  } else {
    res.setHeader("Allow", "POST");
    res.status(405).end("Method Not Allowed");
  }
}

额外注意事项 #

• 确保ele.imageURL是公开可访问的HTTPS链接，Stripe服务器需要能抓取到该图片资源，HTTP链接或私有链接会导致验证失败。
• 如果存在部分商品没有图片的场景，建议添加空值判断，避免传入无效数组：

  images: ele.imageURL ? [ele.imageURL] : []
  

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