使用Braintree支付时提示Cannot determine payment method错误如何解决

报错信息 #

{errors: {…}, params: {…}, message: 'Cannot determine payment method.', success: false} 
errors: {validationErrors: {…}, errorCollections: {…}} 
message: "Cannot determine payment method." 
params: {transaction: {…}} 
success: false

根因排查 #

• 前后端参数命名不匹配：前端请求传给后端的支付随机串字段是paymentMethodNonce（小驼峰命名），但后端控制器里从请求体取的字段是payment_method_nonce（下划线命名），导致后端拿到的nonceFromTheClient是undefined，Braintree接口收不到合法的支付方式随机串就抛出该错误，这是该场景下最高概率的触发原因
• 支付随机串（nonce）生成后未成功传递：前端调用requestPaymentMethod获取的nonce为空，或者传递给后端的过程中被拦截、丢失
• Braintree网关配置错误：后端初始化的gateway对象使用的公钥、私钥、商户ID与前端生成client token用的身份信息不匹配
• 支付方式未完成授权：用户在前端支付弹窗选择支付方式后未完成确认操作，导致拿到的nonce是无效值
• 金额参数异常：传递的amount为空、格式非法（比如不是字符串/数字、包含特殊字符、小数位超过两位）

解决方案 #

1. 优先修正参数命名不匹配问题 #

二选一操作即可：

• 方案1：修改后端取值逻辑，和前端传的字段名对齐
  修正后的后端代码片段：

  const nonceFromTheClient = req.body.paymentMethodNonce;
  

• 方案2：修改前端传参逻辑，和后端取值字段对齐
  修正后的前端paymentData构造代码：

  const paymentData = {
      payment_method_nonce: nonce,
      amount: getTotal(products)
  };
  

2. 其他异常场景排查步骤 #

• 在后端processPayment接口最开头打印req.body，确认nonce和amount两个参数都有合法值
• 前端拿到nonce后先打印确认非空，再向后端发送请求
• 确认前后端使用的是同环境（沙箱/生产）的Braintree身份凭证，没有跨环境混用
• 确认传递的金额为正数，小数位不超过2位，符合Braintree接口格式要求

内容的提问来源于stack exchange，提问作者Md.Mujahidul Islam Tahmid