Hi
I need to set up an API call to get the user’s stripe subscription status. And make pages within my program accessible/inaccessible if the user is paid or not.
Can anyone help me with this or provide a link?
Use the stripe.js 2 plugin here. It allows you to call the Stripe subscription API and will return a value of active, cancelled, etc.
When a user signs up for a subscription, you’ll want to store the subscription ID in your database related to the user. This could be on the user’s thing, or in a separate table strictly for subscriptions.
When a user is on a page that should be restricted, ‘On page Load’ check the user’s subscription at the stripe API to make sure it’s active. If no, re-direct them to a different page or display some error message while hiding the goods they don’t have access to.
Im not super familiar with what youre saying. Still new to this stuff. Do i have to use an API connector? or just fill in the stuff in the stripe.js 2 plug in
no worries, here are some pictures to guide you.
Make sure this plugin is installed, and add your private keys to the plugin page. googling stripe api keys should point you in the right direction:
Add a stripe_subscription field to your User data thing:
When users subscribe, you’ll want to put their subscription ID into that field. Depending on how they sign up, this can be done a few different ways. The most common way would be to use an action from the workflow tab where when the subscription is successful, you’d use a ‘Make changes to the current user’ action and save the ID. It sounds like you’re new to bubble, so I’d recommend checking out the docs / tutorials on saving / updating user data.
For now, let’s assume you’ve successfully saved the stripe subscription ID, and move on to only showing data for subscribed users.
Go to the page you have subscriber content on. On the workflow tab, add a workflow for ‘Page is loaded’:
Add an action to retrieve the a subscription (you only can access this action with the plugin installed!):
Add the current user’s stripe_subscription field in the value. We’re telling bubble to take the user’s saved subscription id, and ask stripe the status of it.
Create a second action to ‘Go to a page’. In my case, I’m going to send them to the index page if they don’t have an active subscription. In the ‘Only when’ section, select ‘Result of step 1’, then select ‘Status’, then select ‘is not’, and then manually type in ‘active’ (this may or may not need a capital A, unfortunately I can’t check right now). In plain english, what this is saying is ‘if stripe doesn’t say they have an active subscription, send them to a different page’.
This is just one way to go about it. Instead, you may want them to access the page, but see an error message asking them to subscribe. In that case, you’d still use the stripe.js plugin, you’d still check their subscription status, but instead of worrying about when ‘Page is Loaded’, you could do something like a conditional on the content on the page itself.
I asked GPT4 to outline the steps of hiding content on a page if their subscription status isn’t active. Here is what it said, it looks pretty spot on:
Thanks! I followed everything you said, but I am not seeing the “is not active” anywhere. Should it be there?
select ‘is not’, and then type then type the word ‘active’. Stripe could return a number of different statuses, bubble doesn’t know the different options so you have to write in what you want
1 Like
Thanks!
In my header, I have 3 pages. “today”, “route” and “account” I want the today and route pages to be inaccessible if the user doesnt have an active subscription. Any idea on how I could add that condition to those two buttons? Thanks!
if by ‘inaccessible’ you mean the links are not visible, go to the ‘today’ link on your header. Under appearance, make sure it is NOT visible on page load. On the conditional tab, set a similar check for the user’s stripe subscription status. But this time, make it ‘is active’, instead of ‘is not active’. Then underneath this condition, set the element’s visibility to show if this condition is met.
Hey. I have done everything that you and ChatGPT said, but its not working for me. Can you take a look at my project?
I did it all under page “logged_in_profile_user” on the User Card element. I am trying to set the group next to the text “Account Status:” to show whenever the user’s account is active, but it is not showing on active accounts. Any idea why?