Briesma - prevent 3DS redirect | Stripe Developers | Page 1

cloud flame Apr 5, 2022, 3:02 PM

#

Can you tell me a bit more about what you are using? Is this your own Custom webpage with Stripe Elements?

hasty mirage Apr 5, 2022, 3:31 PM

#

Yes. We are including Stripe elements within a MUI Drawer (https://mui.com/components/drawers/) component.

React Drawer component - MUI

Navigation drawers provide access to destinations in your app. Side sheets are surfaces containing supplementary content that are anchored to the left or right edge of the screen.

cloud flame Apr 5, 2022, 3:41 PM

#

Is this the Payment Element then? Unfortunately you can only set redirects to happen if_required so they still can happen but with 3DS specifically I think it will still be a modal https://stripe.com/docs/js/payment_intents/confirm_payment#confirm_payment_intent-options-redirect

Stripe JS Reference

hasty mirage Apr 5, 2022, 4:04 PM

#

Okay. Is it possible to avoid this behaviour if we use the Card Element instead?

distant kiln Apr 5, 2022, 4:05 PM

#

Hi 👋 I'm stepping in for @cloud flame . You want to avoid even the modal 3DS verification?

hasty mirage Apr 5, 2022, 4:13 PM

#

Not necessarily. As long as it doesn't require a redirect from my current place in the application, it's okay.

distant kiln Apr 5, 2022, 4:16 PM

#

As @cloud flame mentioned above, the common implementation of 3DS authentication that the Payment Element uses renders the form within a modal so the user isn't redirected away from your app.

bright karma Apr 5, 2022, 4:42 PM

#

const options = { elements, confirmParams: { return_url: "https://example.com", // Return URL where the customer should be redirected after the SetupIntent is confirmed. }, redirect: "if_required", // handle if no redirection. If redirection, we will have to load the correct wizard-step and open the Drawer before rendering }

So if I use thoses options, I have to configure "return_url" because it's a required field, but it will not be use ?

Should we implement a return url to deal with edge case ?

distant kiln Apr 5, 2022, 4:47 PM

#

Because this tool is desined to handle payment methods that require redirection (e.g. afterplay_clearpay), we need to require this parameter. I would include it for edge cases where payment method issuers require a full redirect.

bright karma Apr 5, 2022, 4:52 PM

#

If we use only credit card (north america), we should not have redirection ?

If in 99% of the time we dont redirect, I could simply redirect and show an alert with "Succed" or "Error" to deal with the 1% edgecase

distant kiln Apr 5, 2022, 4:53 PM

#

We are seeing more NA banks starting to use 3DS authentication but that should be handled by the modal approach.

bright karma Apr 5, 2022, 4:54 PM

#

Ok thanks a lot, you are very helpfull 🙂

distant kiln Apr 5, 2022, 4:56 PM

#

Sure thing, happy to help 🙂

#Briesma - prevent 3DS redirect