Stripe Checkout Customer ID to Xano

Getting started with the new stipe plugin! Thought I would share how I am setting up Subscriptions with user accounts in Xano because it took me a long time to figure out.

  1. Install the plugin including test keys

  2. Add a workflow to the element that initiates the checkout.

  1. In order to connect the purchase to a user, I am creating a Stripe Customer first and adding that id to the correct user in Xano. Query all user records and filter by authorized user. If the stripe id does not exist, then use Stripe Customer API (https://api.stripe.com/v1/customers) to create one, and then add that customer id to your user’s account. I used the “Import Curl” button with the input on the Stripe documentation page, then customized for name and email. Return the user info.

  1. Fill in the Weweb stripe checkout workflow, using the result from step 1. This button is for a single subscription, so I copied the Price ID from Stripe directly. I don’t have a fancy success page yet, just sending back to the profile. Will look into success popup using a query.

  2. We need to send the subscription update to Xano to show that the account has been upgraded. Create a table called subscriptions, and Create a Post request in Xano that accepts JSON. I based this on the Xano Stripe webhook example/tutorial. Need to find the matching user record.

  1. Create a Webhook in Stripe with the alerts below. Set the url to the new endpoint in Xano.

This is as far as I’ve gone, but I think I could check the user status in Weweb this way. I will also check out the weweb customer portal when I get the chance.

I was using Outseta before with Webflow. That was much easier and may be a good option for a plugin. This method is nice because I learned a lot about how the parts work together, which should come in handy when I add more features. Thanks for the new feature to play with!

5 Likes

Very nice guide. Learning how to use the Stripe API directly is always more powerful than a readymade integration.Well done!

2 things you can add to improve the security of the webhook:

  • accept requests only from the official Stripe IP addresses

  • verify the signature to be sure that you can trust the data in the request. As an alternative you can also query the Stripe API to check the legitimacy of the data but in this way you don’t use the full potential of the webhook.

3 Likes