Setting up Stripe Webhooks for your Bubble App

In this tutorial we'll see how to create webhooks in Stripe to let our Bubble app know when a subscription is Updated to a different plan or Cancelled

nandy nocode
36 steps
2 minutes

Stripe

Bubble

We'll create 2 Webhooks [[customer.subscription.updated]] [[customer.subscription.deleted]]

Navigate to <https://dashboard.stripe.com/test/dashboard>

Click [[Developers]] > [[Webhooks]]

Click "[[Add endpoint]]"

Click the **Endpoint URL** field & paste this URL: [[https://your-app-name.bubbleapps.io/version-test/api/1.1/wf/subscription-updated/?api_token=]] Replace [[your-app-name.bubbleapps.io]] with your domain name & remove [[/version-test]] if you're doing this for **Live Mode**

Click the "https://" field.

Now Go to your Bubble Editor, Click [[Settings]].

Click "[[API]]"

Click "[[Generate a new API token]]"

Name your Token & Click the below key to Copy.

Now go back to Stripe & paste the key near [[?api_token=]]

Click "[[Select events]]"

Type "[[subscription]]" & Click "[[customer.subscription.updated]]"

Click "Add events"

Click "Add endpoint"

Now We'll add another webhook for [[Subscription Cancel Event]]

On your Stripe Dashboard, Click "[[Developers]]"

Click [[Add Endpoint]].

Click the Endpoint URL field & paste this URL:\ [[https://your-app-name.bubbleapps.io/version-test/api/1.1/wf/subscription-deleted/?api_token=]] \ Replace [[your-app-name.bubbleapps.io]] with your **domain name** & remove [[/version-test]] if you're doing this for **Live Mode**

Click the "https://" field.

Go to your Bubble Editor & copy the Private Key again

Paste it near [[?api_token=]]

Click "[[Select events]]"

Type "[[sub]]" & Click "[[customer.subscription.deleted]]"

Click "[[Add events]]"

Click "[[Add endpoint]]"

Now you've added 2 Webhook events, Let's test if they're working correctly.

Navigate to [https://dashboard.stripe.com/test/dashboard](https://dashboard.stripe.com/test/dashboard)

Click "Subscriptions"

Select any [[Active Subscription]]

Click "[[Cancel subscription]]"

Click "[[Immediately]]"

Click "[[Cancel subscription]]"

Now Let's see if it is Updated in our Bubble App

Go to Bubble Editor & Click [[Data]].

Click "[[App data]]"

Click [[All Subscriptions]].

Click the [[Edit Icon]] of the Subscription you cancelled in Stripe.

Now you can see it is updated in your Bubble app as well

Setting up Stripe Webhooks for your Bubble App

In this tutorial we'll see how to create webhooks in Stripe to let our Bubble app know when a subscription is Updated to a different plan or Cancelled

nandy nocode
36 steps
2 minutes

Stripe

Bubble

We'll create 2 Webhooks [[customer.subscription.updated]] [[customer.subscription.deleted]]

Navigate to <https://dashboard.stripe.com/test/dashboard>

Click [[Developers]] > [[Webhooks]]

Click "[[Add endpoint]]"

Click the "https://" field.

Now Go to your Bubble Editor, Click [[Settings]].

Click "[[API]]"

Click "[[Generate a new API token]]"

Name your Token & Click the below key to Copy.

Now go back to Stripe & paste the key near [[?api_token=]]

Click "[[Select events]]"

Type "[[subscription]]" & Click "[[customer.subscription.updated]]"

Click "Add events"

Click "Add endpoint"

Now We'll add another webhook for [[Subscription Cancel Event]]

On your Stripe Dashboard, Click "[[Developers]]"

Click [[Add Endpoint]].

Click the "https://" field.

Go to your Bubble Editor & copy the Private Key again

Paste it near [[?api_token=]]

Click "[[Select events]]"

Type "[[sub]]" & Click "[[customer.subscription.deleted]]"

Click "[[Add events]]"

Click "[[Add endpoint]]"

Now you've added 2 Webhook events, Let's test if they're working correctly.

Navigate to [https://dashboard.stripe.com/test/dashboard](https://dashboard.stripe.com/test/dashboard)

Click "Subscriptions"

Select any [[Active Subscription]]

Click "[[Cancel subscription]]"

Click "[[Immediately]]"

Click "[[Cancel subscription]]"

Now Let's see if it is Updated in our Bubble App

Go to Bubble Editor & Click [[Data]].

Click "[[App data]]"

Click [[All Subscriptions]].

Click the [[Edit Icon]] of the Subscription you cancelled in Stripe.

Now you can see it is updated in your Bubble app as well