#hamdan-nagarro_best-practices
cinder sinewBOT
đ Welcome to your new thread!
â˛ď¸ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.
âąď¸ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.
đ This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1319578371117678625
đ Have more to share? Add more details, code, screenshots, videos, etc. below.
river hawk
For this can the flow be like this:
On payment page we create a checkout session with all data entered by user as metadata. Once payment is made, the back-end retrieves the meta-data from the session_id and create the user if succeeded status is there. But in this case how will failure cases be handled?
forest cedar
Are you asking about how to handle payment failure in a checkout page?
river hawk
No, what would be the best practice for handling scenarios, where we want to submit form after payment is confirmed. Considering return url redirects.
forest cedar
Is it about fulfillment? https://docs.stripe.com/checkout/fulfillment
river hawk
Yes, but in the case where I have a form where user has entered their details for signing up to our application. After payment is successful, I want to create the user on our platform. What will be the best flow to handle this?
Some approaches are:
- We can store user details in local-storage and in return url we can check for success, after success we can call the create user api on front-end
- We can create checkout session with user details as meta-data, on payment succeed, back-end webhook will create user.
I am looking for the best practice for our use-case.
forest cedar
My recommendation is to listen to checkout.session.completed webhook event and check the session's payment_status https://docs.stripe.com/api/checkout/sessions/object?lang=node#checkout_session_object-payment_status
If the payment_status is true, then yu can redirect your customer to fill up the form
river hawk
Oh great. For the signup scenario this is excellent! There is one more use-case. Where user clicks on a booking to confirm it. He needs to make payment before he confirms it. The same solution cannot work for this use-case as the payment and confirmation for the booking on our end should happen in one user action. Is there a way to achieve this. Thanks for your prompt replies
forest cedar
This sounds like another fulfillment task and I don't understand why the current flow can't support it. Can you elaborate with more context?
cinder sinewBOT
river hawk
We have two platforms, web (react) and mobile (react-native). In the scenario where the web-hook is successful, then how will the web-hook, let the front-end know to redirect to a url, or the status of payment
river hawk
Oh great. For the signup scenario this is excellent! There is one more use-case....
and in this case like I said, user clicks on confirm booking. We already have their payment methods stored, we want to confirm payment is successful, then depending on payment status, the front-end does :
succeeded - Call the confirm booking api (can be done on back-end as well but need to let front-end know that it's successful, not possible from within web-hooks as I understand)
failure - Tell user to enter card details again.
warped sinew
You get the response from your frontend when you confirm the Payment.
What Product are you using eaxctly in your web and mobile integration ?
I imagine, you are using Element on Web and PaymentSheet on Mobile ?
river hawk
yes we are using element and paymentsheet
river hawk
You get the response from your frontend when you confirm the Payment.
can you elobarate a little on this, please
warped sinew
The PaymentElement got the response of the status of the Payment: it's succeeded or failure
You can try the preview in this quickstart and check this behavior:
https://docs.stripe.com/payments/quickstart?platform=web&client=html&lang=node
Same for React Native and PaymentSheet:
https://docs.stripe.com/payments/accept-a-payment?platform=react-native#react-native-collect-payment-details:~:text=When your customer taps the Checkout button%2C call presentPaymentSheet() to open the sheet. After the customer completes the payment%2C the sheet is dismissed and the promise resolves with an optional StripeError<PaymentSheetError>.
river hawk
Okay but this will redirect the user to a success page. How will the data entered by user be sent to the back-end if the page is redirected.
warped sinew
Not always there is redirection. But in case there'll be, if it's a web app, there'll be a redirection back to your website via an URL you specify. You'll get the Payment Intents id as query params.
And if it's a mobile App, the SDK will handle this for (expect for IOs you'll need to configure it.)
river hawk
Yes but if there is a redirect how do I preserve the data that was entered/selected by the user.
warped sinew
You need to design your webpage in a way that keeps tracking/saving these data
like you save all entered data before confirming the Payment
warped sinew
Happy to help!