2016-06-21 9 views
0

Ich versuche Braintree Drop-in-Benutzeroberfläche in node.js hinzuzufügen. Es sieht so aus, als sollte es einfach sein, aber ich bin sowohl mit Braintree als auch mit Knoten neu und habe einige Probleme! Zuerst habe ich ein neues Braintree-Gateway erstellt, das korrekt generiert wird. Dann habe ich eine serverseitige Route erstellt, die ein Token aus Braintree generiert.Braintree CSRF-Token fehlt

app.route('/client_token').get(function(req, res) { 
    console.log(gateway); 
    gateway.clientToken.generate({}, function (err, response) { 
     res.send({clientToken: response.clientToken}); 
    }); 
    }) 

Dann habe ich die Client-Seite-Controller, der das Token zugreift, und ermöglicht es mir, die Drop-in ui aufzutauchen. Das funktioniert alles.

(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 
    }); 

})(); 

Hier bleibe ich stecken. Das Drop-in-Formular sollte dann eine Post-Anfrage an '/ checkout' machen und die Zahlung sollte durchlaufen werden! Hier ist mein Code dafür, und der Drop-in-Ui-HTML.

-Controller

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> 

Und dann alles bricht ... Irgendwelche Ideen? Ich bin auch neu in StackOverflow, daher wird jedes Feedback zu Format und Inhalt dieser Frage geschätzt.

GET /client_token 200 492.478 ms - - 
Error: CSRF token missing 
    at checkCsrf 
POST /checkout 403 23.809 ms - - 

Antwort

0

Das Problem war Lusca! Wenn Sie Lusca in einer Express-Konfigurationsdatei aktiviert haben, müssen Sie diese in der Entwicklung deaktivieren.