Collecting Payments
First, create the charge on the server using the Whop API. Then you can either:- Open a modal in your app using the iframe SDK (recommended)
- Redirect the user to Whop’s checkout page
1. Create the charge on the server
This step will create a charge on the server and return the inAppPurchase object required for the next step.On the server, use the chargeUser method to create a charge:
app/api/charge/route.ts
2. Confirm the payment on the client
In this step the user will be prompted to confirm the previously created charge in a modal.
This function requires the iFrame SDK to be initialized. See iFrame
Overview for more information.
3. Validate the payment
After a payment is processed, you should validate it on your server using webhooks to ensure the payment was successful and update your application accordingly.Set up a webhook route to handle payment events:
app/api/webhook/route.ts
Make sure to create a webhook in your dashboard app settings and set your
WHOP_WEBHOOK_SECRET
environment variable.