问角度控制器无法检测Braintree payment nonce动态输入字段
EN

Stack Overflow用户

提问于 2015-01-20 04:11:38

回答 3查看 2.6K关注 0票数 3

只要您点击submit，Braintree的customer creation SDK系统就会在表单中生成一个随机数输入域。

<input name="payment_method_nonce" type="hidden" value="nonce-here">

但是，使用Angular的ng-model输入识别系统，我无法在控制器中检测到动态生成的输入。表单一提交，我就在我的控制器中执行一个函数。

<form id="checkout" id="checkout" ng-submit="processForm(formData)">

正如您所看到的，没有办法收集nonce的值并将其提交给brain tree API命令，例如创建新用户的支付方式。

在控制器中，使用$http将数据提交给下面的braintree api命令。

gateway.customer.create({
creditCard: {
token: "creditCard123",
},
paymentMethodNonce: "nonce-from-the-client"
}, function (err, result) {
});

我是不是走错路了？即使这个应用程序是在Angular/express中，我也应该使用纯节点来构建一个解决方案吗？或者我应该使用jquery/angular在上述输入字段中植入一个ng-model？

angularjs

node.js

express

braintree

javascript

云开发个人版免费体验1个月

云开发是云原生一体化开发环境和工具平台，提供高可用、自动弹性扩缩的后端云服务，可用于云端一体化开发多种端应用

回答 3

Stack Overflow用户

发布于 2015-01-20 16:41:08

我在Braintree的SDK团队工作。

您可以使用回调来侦听nonce，而不是将其自动写入DOM。

braintree.setup('CLIENT_TOKEN', 'dropin', {
    container: 'container',
    paymentMethodNonceReceived: function (event, nonce) {
      // Do something with the nonce here
    }
});

这也将阻止表单代表您自动提交。您可以阅读更多文档here。如果您仍然遇到问题，请随时联系support@getbraintree.com。

票数 6

Stack Overflow用户

发布于 2015-01-21 00:56:47

我通过实验将Braintree设置代码放在角度控制器中，并在node中编写post url调用，从而使其正常工作。我想尽可能多地使用Angular，但在Angular .Config路由中编写urls似乎是不可能的。我收到的两个答案都帮助我让它正常工作。谢谢你们两位。

在控制器中

$scope.$watch('cToken', function (newVal, oldVal) { //Watch for client token to be loaded then place in braintree.setup api call.
    if (!newVal) return;
    if (newVal){
      console.log('set braintree');
      braintree.setup($scope.cToken, 'custom', {
      id: "checkout",
      paymentMethodNonceReceived: function (event, nonce) {
              // Do something with the nonce here
              event.preventDefault();
            }
        });
    }
  });

在node.js app.js中

app.post('/api/generateNonce', routes.generateNonce);
exports.generateNonce = function(req, res){
var nonce = req.body.payment_method_nonce;
console.log('nonce '+nonce);

gateway.customer.create({
  id: 'clientId2222',
  paymentMethodNonce: nonce
}, function (err, result) {
  var result = JSON.stringify(result);
  console.log('result '+ result);
  console.log(result.success);
  console.log(result.message);
  // e.g f28wm
});

res.send(nonce);
}

和前端。

<form  name="creatClientForm" class="css-form" id="checkout" action="/api/generateNonce" method="POST" enctype="multipart/form-data">
      <input data-braintree-name="number" value="4111111111111111">
      <input data-braintree-name="expiration_date" value="10/20">
      <input type="submit" id="submit" value="submitform">
  </form>