React电商项目Stripe支付因印度监管报错，如何配置必填参数修复？

问题根源 #

你当前的报错是因为印度跨境支付监管要求的必填字段name、billing address、description、shipping address没有在支付确认请求中传递，触发了Stripe的合规校验拦截。

前置准备 #

你需要先在支付页表单中补充对应字段的输入能力，提前将用户输入的信息存储到以下变量中：

• customerName：客户完整姓名
• orderDesc：订单描述，需清晰说明交易对应的商品/服务内容
• billingAddress：账单地址对象，包含line1（详细地址）、city（城市）、state（省份/邦）、postal_code（邮编）、country（两位ISO国家码）
• shippingAddress：配送地址对象，结构和账单地址一致

代码修改 #

你需要调整stripe.confirmCardPayment的传参结构，补充所有必填字段，同时修复你原有代码中多余的右大括号语法错误，修改后的代码如下：

const handleSubmit = async (event) => {
    event.preventDefault();
    setProcessing(true);

    const payload = await stripe.confirmCardPayment(clientSecret, {
        payment_method: {
            card: elements.getElement(CardElement),
            // 补充账单信息
            billing_details: {
                name: customerName,
                address: billingAddress
            }
        },
        // 补充订单描述
        description: orderDesc,
        // 补充配送地址
        shipping: {
            name: customerName,
            address: shippingAddress
        }
    }).then(({ error, paymentIntent }) => {
        // 新增错误分支处理
        if (error) {
            setError(error.message);
            setProcessing(false);
            return;
        }
        // 原有后续逻辑保持不变
        db
          .collection('users')
          .doc(user?.uid)
          .collection('orders')
          .doc(paymentIntent.uid)
          .set({
              basket: basket,
              amount: paymentIntent.amount,
              created: paymentIntent.created,
          })

        setSucceeded(true);
        setError(null)
        setProcessing(false)

        dispatch({
            type: 'EMPTY_BASKET'
        })

        history.replace('/orders')
    })
}

注意事项 #

• 地址中的国家码需使用两位ISO 3166-1标准编码，比如印度为IN、中国为CN
• 订单描述不可过于笼统，需明确对应交易内容，避免合规校验不通过
• 你也可以选择在后端创建PaymentIntent时就传递以上所有必填字段，效果和前端传递一致

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