Learn how to embed a custom WooshPay payment form in your website or application. The client- and server-side code builds a checkout form with Elements to complete a payment using various payment methods.
Add an endpoint on your server that creates a PaymentIntent. A PaymentIntent tracks the customer’s payment lifecycle, keeping track of any failed payment attempts and ensuring the customer is only charged once. Return the PaymentIntent’s client secret(PaymentIntent number in this case) in the response to finish the payment on the client. We enable cards for you by default.
Use wooshpay.js to remain PCI compliant by ensuring that payment details are sent directly to WooshPay without hitting your server. Always load wooshpay.js from js.wooshpay.com to remain compliant. Don’t include the script in a bundle or host it yourself.
Complete the payment Call confirmPayment(), passing along the PaymentElement and a return_url to indicate where WooshPay should redirect the user after they complete the payment. For payments that require authentication, WooshPay displays a modal for 3D Secure authentication or redirects the customer to an authentication page depending on the payment method. After the customer completes the authentication process, they’re redirected to the return_url.
If there are any immediate errors (for example, your customer’s card is declined), wooshpay.js returns an error. Show that error message to your customer so they can try again.
When WooshPay redirects the customer to the return_url, the payment_intent_client_secret query parameter is appended by wooshpay.js. Use this to retrieve the PaymentIntent to determine what to show to your customer.