0
BraintreeのドロップインUIをnode.jsに追加しようとしています。シンプルなはずですが、私はBraintreeとノードの両方に新しいし、いくつかの問題があります！まず、新しいBraintreeゲートウェイを作成しました。これは正しく生成されています。その後、私はBraintreeからトークンを生成しているサーバー側のルートを作成しました。Braintree CSRFトークンがありません
app.route('/client_token').get(function(req, res) {
console.log(gateway);
gateway.clientToken.generate({}, function (err, response) {
res.send({clientToken: response.clientToken});
});
})
次に、トークンにアクセスしているクライアント側コントローラを作成し、ドロップインUIをポップアップ表示させます。これはすべて動作しています。
(function(){
class CheckoutComponent {
constructor($http) {
this.$http = $http;
}
$onInit() {
this.$http({
method: 'GET',
url: '/client_token'
}).then(function successCallback(response) {
braintree.setup(
response.data.clientToken,
"dropin", {
container: "payment-form"
});
}, function errorCallback(response) {
});
}
}
angular.module('toroApp')
.component('checkout', {
templateUrl: 'app/checkout/checkout.html',
controller: CheckoutComponent
});
})();
これは私が立ち往生する場所です。ドロップインのフォームでは、 '/ checkout'への投稿リクエストを行い、支払いは完了します。ここに私のコードとドロップインのHTMLがあります。
コントローラ
app.route('/checkout').post(function (req, res) {
var transactionErrors;
var amount = 10; // In production you should not take amounts directly from clients
var nonce = req.body.payment_method_nonce;
gateway.transaction.sale({
amount: amount,
paymentMethodNonce: nonce
}, function (err, result) {
if (result.success || result.transaction) {
res.redirect('checkouts/' + result.transaction.id);
} else {
transactionErrors = result.errors.deepErrors();
req.flash('error', {msg: formatErrors(transactionErrors)});
res.redirect('checkouts/new');
}
});
});
HTML
<form id="checkout" method="post" action="/checkout">
<div id="payment-form"></div>
<input type="submit" value="Pay $10">
</form>
<script src="https://js.braintreegateway.com/js/braintree-2.25.0.min.js"></script>
そしてすべての改...任意のアイデア？私はStackOverflowも新しくなっているので、この質問のフォーマットと内容に関するフィードバックは高く評価されます。
GET /client_token 200 492.478 ms - -
Error: CSRF token missing
at checkCsrf
POST /checkout 403 23.809 ms - -