3D Secure Card Payment

Describe the bug Hey guys, help me out here…

I am working on a client project for an Indian company and I got the stack running on my local machine with my own API keys. Everything but the payment seems to be working.

When I attempt to checkout, I get the following error:

completeCheckoutUsingCard Service Error: As per Indian regulations, export transactions require a customer name and address

Now I know what the error means, but why does it show and how would one fix this on your codebase (I just begun working on the client project and this is the first time I am building an E-Commerce site, so please, please help…)(FYI, I am 19 and this is my first client)

Also, I played around a bit with your version of it (over on shop.veniqa.com) and I know for a fact that you are using test API keys (duh) so I tried using a 3D secure Card from one of Stripes Test Cards section such as

4000002760003184 or 4000 0027 6000 3184 and neither work.

I really, really need your help. Please help me.

Thanks.

–

To Reproduce Steps to reproduce the behavior:

1. Go to shopping-client facing app
2. Click on checkout with one of the aforementioned cards
3. It will say ‘payment failed’ and then take a look at your console logs
4. You would then See error

Expected behavior

3D secure window for Two-Factor Authentication should pop up (like a Modal).

I really really hope that you guys would help me out here. Eagerly looking forward to your response!

[gfyre]

@AmandaDLyon I am going to attempt to add PaymentIntent which would allow 3D secure to work. Once I have successfully implemented and tested it, I’ll submit a PR and you can take it ahead from there.

[AmandaDLyon]

@smaharj1 Once I have launched my clients project, I’ll implement my solution into Veniqa submit a pull request along with what I did to make it work.

However, basically, these are the steps to follow:

Stripe 3DS SCA integration needs to be done on the Client and Server end. Below are the steps in general:

1. Create a paymentIntent (ID essentially) on the server when the client is on the checkout page (for example)
2. You then take the “client_secret” (which is within the paymentIntent created above) and make it accessible to the web client (customer-facing frontend)
3. Then you collect the card details which in our case is collected by Stripe Elements
4. Then call stripe.confirmCardPayment
5. Handle a declined payment by asking the customer to re-check their card details and only if the payment is successful, push the order to an approved checkout bucket and push the customer to the checkout page.