Braintree - how to refresh javascript authorization token?

user_3355243 0
Viewed 292

Whenever the user gets the payment declined, no matter what the reason, I need to refresh the authorization token in order to request again to Braintree, otherwise I receive the error:

Cannot use a payment_method_nonce more than once

var token = 'MY_INITIAL_TOKEN';

braintree.dropin.create(
{
    authorization: token,
    container: '#braintree-container',
    paypal:
    {
        flow: 'vault',
    }
}, function(err, instance)
{
    instance.requestPaymentMethod(function(err, payload)
    {
        // Executes HTTP Request
    });
});

After the http request is being done and the payment has been declined I need to refresh the token. The DropIn documentation has a function called updateConfiguration https://braintree.github.io/braintree-web-drop-in/docs/current/Dropin.html#updateConfiguration but I can't seem to get it to work, I have tried without success:

braintree.updateConfiguration('dropin', 'authorization', myNewToken);
braintree.dropin.updateConfiguration('authorization', myNewToken);
dropin.updateConfiguration('authorization', myNewToken);
braintree.dropin.authorization = myNewToken;
braintree javascript
1 Answers

(I work at Braintree. If you have any further questions, contact Support.)

The error you're receiving is not related to authorization, it's because you're trying to re-use the original payment method nonce that was first returned in the payload of your first requestPaymentMethod call.

Payment method nonces are single-use, one-time representations of payment information that are consumed via a server-side call (like transaction.sale). You need to generate a new payment method nonce on your client because the original one was consumed with the declined transaction attempt.

I suggest adding some logic that does the following if a customer's payment method is declined:

  1. Clear the selected payment method and notify the customer their form of payment was declined.
  2. The user will then be brought back to the main view of all your available payment methods, and they can choose a different option/card
  3. Call requestPaymentMethod a second time when the user is ready and isPaymentMethodRequestable returns true
  4. Send the newly returned payment method nonce that's provided in the payload of the second call to your server-side for whatever call you plan to make that uses that payment info.

There's also a demo site available if you'd like to inspect the code, as well as some codepens.

user_78515160
Related