Adding a 3DS card to a Stripe Customer for Subscription payments-CodePudding

I am having a problem to add payment cards with 3DS authentication for customers that already exist and that already have a monthly subscription active. The goal is to give the possibility for our clients to change, remove and add cards to the Stripe Customer object and these cards will be prepared for doing future payments. I also gave the possibility to cancel subscriptions and choose different subscriptions.

The system that I created works fine for cards without 3DS, but for cards with 3DS it appears that I always need to do the 2 factor security. Also, I am testing with the Stripe test card "Always authenticate". But when I add the card, the verification panel shows up to me and I accept it, but the next time I try to change the subscription it doesn't process the payment because of the 3DS security.

1. Does this mean that when I change subscription plan I need to do a 3DS verification?

2. Also, for all monthly payments do I need to make the 2 factor verification?

3. And if I have an outstanding amount to pay from previous invoices do I need to do a 3DS verification to pay them off?

4. I know that some apps you can add the card once and all the payments after that are covered for that one verification. Is there a way to add a 3DS "Always authenticate" card attached to the customer account and make all the subscription payments with it?

Here it is the code:

Setting up the Stripe elements - client side

elements = stripe.elements();

var elementStyles = {
    base: {
      color: '#32325D',
      fontWeight: 500,
      fontFamily: 'sans-serif',
      fontSize: '18px',
      fontSmoothing: 'antialiased',
      fontLineHeight: '1.5',

      '::placeholder': {
        color: '#CFD7DF',
      },
      ':-webkit-autofill': {
        color: '#e39f48',
      },
    },
    invalid: {
      color: '#eb1c26',

      '::placeholder': {
        color: '#e35b62',
      },
    },
  };

  var elementClasses = {
    focus: 'focused',
    empty: 'empty',
    invalid: 'invalid',
  };

cardNumber = elements.create('cardNumber', {
    showIcon: true,
    style: elementStyles,
    classes: elementClasses,
});
cardNumber.mount('#card-number');

cardExpiry = elements.create('cardExpiry', {
    style: elementStyles,
    classes: elementClasses,
});
cardExpiry.mount('#card-expiry');

cardCvc = elements.create('cardCvc', {
    showIcon: true,
    style: elementStyles,
    classes: elementClasses,
});
cardCvc.mount('#card-cvc');

cardNumber.on('ready', function(event){

    $("#settings_page_payment_loading").css({ 'display' : 'none' });
    $("#settings_page_payment_placeholder").css({ 'display' : 'block' });

});

Create client secret key - on server side. This is the function that is quested for the client secret after the client clicks the "add card" button.

const setup_intent = await stripe.setupIntents.create({
    payment_method_types: ['card_present'],
    customer: customer_ID
});

After the client secret is created, the key is received by the following function - client side:

stripe.confirmCardSetup(data.client_secret, {
    payment_method: {
        type: 'card',
        card: cardNumber,
        billing_details: {}
    },
}).then(function(result) {

    // Handle result.error or result.paymentIntent
    if(result.error){
        // IF NOT SUCCESS
    }else{  
        // IF SUCCESS
    }

});

I am making the requests using only AJAX requests and not forms. I feel like it is missing some more steps, but I am not really sure.

Thank you very much for your help!

CodePudding user response：

Does this mean that when I change subscription plan I need to do a 3DS verification?

Potentially, yes. In your testing, you can use the "Already set up" card to skip any authentication. When you're accepting live payments, you can try to start a new subscription using a customer's saved card details. If their bank requires additional authentication, you'll need to bring them back on session to complete 3DS verification.

Also, for all monthly payments do I need to make the 2 factor verification?

If you use the "Authenticate unless set up" card, you'll need to go through authentication for the first payment only. If you use the "Already set up" card, no authentication is needed for any of the payments, including the first invoice.

And if I have an outstanding amount to pay from previous invoices do I need to do a 3DS verification to pay them off?

See # 2

I know that some apps you can add the card once and all the payments after that are covered for that one verification. Is there a way to add a 3DS "Always authenticate" card attached to the customer account and make all the subscription payments with it?

No, the "Always authenticate" card will always require 3DS authentication. Based on Stripe's testing documentation, the card labeled "Always authenticate" will always require 3DS, regardless of whether it has been used to start a subscription or used to create a SetupIntent. It sounds like you should use either the card labeled "Authenticate unless set up" or "Already set up".

In live mode, setting up a card for future off-session use should decrease the likelihood of requiring 3DS authentication. However, a customer's bank may require it at their discretion. When creating off-session payments, you'll want to look out for a PaymentIntent's status and have customers come back on session if the status is requires_action