使用React Native的PaymentSheet时出现「Received unknown parameter: client_secret」错误

兄弟，我之前折腾Stripe React Native的时候也踩过这个一模一样的坑！其实问题根源就出在参数命名的格式不匹配上，给你捋捋怎么解决：

• 先搞清楚两个命名的区别：Stripe后端API返回的支付意图密钥是下划线格式的client_secret，但@stripe/stripe-react-native库的组件（比如PaymentSheet或者你用的CreditCardModal）要求的是驼峰格式的clientSecret（部分新版本里是paymentIntentClientSecret）。你大概率是直接把后端返回的client_secret原封不动传给组件了，导致库识别不了这个参数，反而报错说收到了未知的client_secret。

• 检查你的传参代码：比如后端接口返回的是res.data.client_secret，你需要把它赋值给组件要求的驼峰参数，举个例子：

  // 假设你从后端拿到密钥的请求
  const clientSecretFromBackend = await fetchPaymentIntentClientSecret(); // 这里返回的是下划线格式的client_secret
  
  // 初始化PaymentSheet时要传对参数名
  const { error } = await initPaymentSheet({
    paymentIntentClientSecret: clientSecretFromBackend, // 新版本正确参数名
    // 旧版本可能是 clientSecret: clientSecretFromBackend
    merchantDisplayName: "你的商家名称",
  });
  

• 核对库的版本：如果你的@stripe/stripe-react-native版本比较旧，参数名可能和新版不一样，建议看看当前版本的本地文档（比如node_modules里的README），确认组件需要的参数名到底是clientSecret还是paymentIntentClientSecret。要是版本太老，干脆升级到最新稳定版，新版本API更清晰，也能减少这种命名不匹配的问题。

• 检查CreditCardModal的配置：如果你是直接用CreditCardModal组件，要确保给它的props里的密钥参数是驼峰格式的，别不小心把后端的下划线字段名直接粘进去，那样肯定会触发错误。

说白了就是Stripe后端API和前端React Native库的参数命名规范不一样，一个用下划线、一个用驼峰，你只要把后端返回的client_secret转成库要求的驼峰参数名传进去，问题应该就解决了！

内容来源于stack exchange