javascript - 使用 Node.js 进行 Braintree 支付无法正常工作

Question

我有以下 html:

<form id="payment-form" method="post" submit="/checkout">
     <input type="submit" value="Pay $10">
     <input type="hidden" name="payment_method_nonce" value="0fgg1679-75e2-43e0-bc1f-94faee177877">
     <iframe src="https://assets.braintreegateway.com/dropin/2.28.0/inline-frame.html#3a713953-3106-4fd5-8714-b0ada1723284" frameborder="0" allowtransparency="true" scrolling="no" name="braintree-dropin-frame" width="100%" height="68" id="braintree-dropin-frame" style="transition: height 210ms cubic-bezier(0.39, 0.575, 0.565, 1); border: 0px; z-index: 9999; height: 70px;"></iframe>
</form>

html 最初只有 input type=submit 和 payment-form 但我的 javascript 具有以下代码，可将元素转换为上面看到的内容:

braintree.setup(BT_CLIENT_TOKEN, "dropin", {
  container: "payment-form"
});

BT_CLIENT_TOKEN已在服务器端成功实例化到客户端。 当我打开网站时，我可以登录沙箱并看到以下内容:

但是，当我点击“pay”时，表单不是通过 Nodejs 服务器端的 app.post("/checkout") 提交的，而是通过默认路由 app 提交的.post(“/”)。此外，请求的正文始终为空 req.body: {} (据我所知，不应该，至少应该带有声明)。

有人知道发生了什么吗？非常感谢。

Answer 1

_{全面披露:我在 Braintree 工作。如果您还有任何疑问，请随时联系support .}

我有几个建议。首先，请务必定义 action <form> 中的属性。

<form id="payment-form" method="post" action="/checkout">

第二，Braintree Drop-in requires a container要嵌套在 <form> 内的元素。这个容器元素应该是 braintree.setup() 中的目标。 .

HTML

<form id="payment-form" method="post" action="/checkout">
  <div id="dropin-container"></div>
</form>

JavaScript

braintree.setup('BT_CLIENT_TOKEN', 'dropin', {
  container: 'dropin-container'
});

关于req.body: {} ，如果不更全面地查看您的代码，就很难深入挖掘，并且我宁愿避免在没有上下文的情况下进行猜测。如果上述建议不能解决问题，也许您可​​以编辑您的问题并提供更多代码片段以帮助社区更仔细地检查此问题。