Stripe Payment flow using js

ghz 8months ago ⋅ 83 views

I am struggling with implementing payment flow on the website. To charge a customer using Stripe, do I need both a SetupIntent and a PaymentIntent? I want to save the customer's card information at the time of payment so that I can use it in the future to charge the customer.

I am currently using stripe for user payment. So, we are having a Signup page for a user from where user can enter the password and confirms it and then clicks on submit. After submiting the user info I am doing below flow

Create customer for that user in stripe using name and email. Then call createsetupIntent stripe API which returns clientsecret use that clientsecret to show paymentelement to the user. Payment popup contains stripe paymentelement and Pay button. When user clicks the pay button I am saving card info of the user in stripe using confirmParams. After that, setting that method as defaultmethod. And finally use paymentIntentAPI to charge a customer with specific amount. If payment is successful then every month my system will charge a customer using Invoice API. because, I am not using subscription based model. Is that flow correct. Or is there any other way to make it more efficient? And how to handle failure cases here like after clcks on Pay button if there is a failure while saving card info or charge a customer then how to handle those cases?

Answers

Your payment flow outline seems mostly correct, but there are a few points to consider and potential improvements to make it more efficient and handle failure cases:

  1. Create Customer: Creating a customer in Stripe with the user's name and email is a good practice, especially if you plan to charge them in the future without requiring them to re-enter their payment information.

  2. SetupIntent vs. PaymentIntent:

    • SetupIntent: This is used to collect payment details securely and prepare for future payments. It's typically used when you want to save a customer's card for future use, as you described.
    • PaymentIntent: This is used to charge a customer immediately. You can create a PaymentIntent when the user clicks the Pay button and charge them right away.
  3. Handling Failure Cases:

    • Saving Card Info: If there is a failure while saving the card info using the SetupIntent, you should handle the error gracefully and inform the user about the issue. You can prompt them to try again or provide assistance if needed.
    • Charging the Customer: Similarly, if there is a failure while charging the customer using the PaymentIntent, you should handle the error and inform the user. You can retry the charge or prompt them to use a different payment method.
  4. Handling Subsequent Charges:

    • Since you're not using a subscription-based model, you mentioned that you plan to charge the customer every month using the Invoice API. Ensure that you have a mechanism in place to handle failed payments for recurring charges. Stripe provides webhooks to notify your system about payment events, such as successful or failed charges. You can use these webhooks to automate handling of failed payments and follow up with customers as needed.
  5. Security and Compliance:

    • Make sure to follow Stripe's best practices for securely handling payment information and comply with relevant regulations, such as PCI DSS compliance.

In summary, your payment flow is generally correct, but it's important to handle failure cases gracefully and ensure security and compliance with payment processing regulations. Additionally, consider leveraging Stripe's features, such as webhooks and retry logic, to automate handling of failed payments and provide a seamless experience for your users.