How to make sub apps use the main app credentials for Login & Signup?

Hi Guys,
We are working on a project requires Main / sub apps and I need your help.

We are building a main app (Store), and sub apps (stores), all sub apps will be an exact copy off the main app. Every Sub app uses its own database tables to create products, orders…etc, but it doesn’t use the users table (data type) of it’s own database. I want all sub apps to use the main app users data type (table) / credentials.

So Store owners/customers use Login / signups using the Main app users data type before they can use the sub app.

Use case:
If (Tom) a customer visit store A (Sub App) and signup, he would technically signup to the Main app not to the sub app and logged in automatically to store A. If then Tom visit a different store let’s say Store B (another sub app), he would be still logged in or can login the same way using the main app.

I know how to use the Bubble App connector to connect apps between them to get Data but don’t know how to utilize the App connector to make all users login/signups using the main App.

This applies to Login / Signup to the main app.

Thank you very much.

2 Likes

The app connector will let you have a button ‘sign up with Main app’ in your sub app. It’s very similar to using ‘Login with Facebook’ in your app. So practically, keep in mind 2 things:

  1. The user table will not be shared between the main app and the sub app. When a user logs in with master app (as in ‘login with facebook’) we make sure the user is logged in with the main app, and then create a user in the sub app’s user table. When you’ll use make a change to current user in a sub app, that will not modify the user object in the main app.

  2. When you use sub apps, all the process of creating new apps (in your case) stores is done manually. You won’t be able to list stores, do operations on them, etc. from the main app.

We usually recommend people to do this on one app, as it offers much more flexibility. Sub apps are more for people that sell the same app to different people, it’s not usually what we recommend to people building a SaaS-type business. But you can do this if you don’t mind the manual process.

1 Like

Thank you Neerja for the valuable information,

Indeed there are some limitation when using the Main App / Subb Apps. But the Manual Process as you said is part of it and we are trying to automate as much as possible.

For the Login / Signups to the master App process: I got theoretical of what you explained, but still unable to replicate it, Can you explain step by step?

thanks

Absolutely. I’ll walk you through the steps where there are 2 apps

  • App A (which can be your main app) and
  • App B (which can be your sub app and you can add as many as you like).

A high level summary of the steps is that App A (main) is where most data operations and workflow executions usually happen. App A will be where the data is stored and data needs to be exposed through an endpoint while App B (sub) is used to drive those workflows and pull data from App A (main).

First we start by setting up app A (main) to give us the right access level (Private Key), allow sharing workflows (expose workflow API) and data (expose Data API), and something like an ID card to tell App A who is talking to it (Client ID & Secret). Then in App A (main) you setup actual workflows to signup but it can be other workflows too like charging a customer or sending them emails. Next, you use the App Connector plugin in App B (sub) to control A (main) by showing your ID, confirming your access level and then telling it what to do.

Below are the details:

  1. Setup a signup workflow in app A (main app)
    App A main workflow

  2. In App A settings > API tab

  • Enable ‘This app exposes a Data API’ and ‘Workflow API’
  • Create a new API token and notice the Private Key
  • Set login page as the one containing your signup popup
  • Add a new 3rd party app with name (such as app B’s name) and Redirect URI which should be the landing page back in App B
  • Notice Client ID and Secret - you will need this later

  1. Back in app B, install App Connector Plugin

  2. Add a new Bubble app within the plugin with following details:

  • App domain: appAdomain.bubbleapps.io (use custom domain if applicable)
  • Enable match versions
  • Private key - get from step 2
  • Client ID & Secret - get from step 2

  1. In App B landing page, create a login button
  • set workflow to account > signup/login with a social network > choose ‘Bubble app - appAname’ as OAuth provider

  1. You’re all set. Try App B in run-mode > click login > you will get redirected to signup page on App A > once logged in, you will get redirected to App B landing page and the user’s login details will be stored on both apps. Note that login is ‘User’ type data that is special in that it gets stored in both apps. Any workflows you drive from the App Connector for App A (main) will run in App A and store data only in App A.

  2. If you want to pull non-user Data from App A (main) into App B (sub), the ‘expose Data API’ will now be useful. You will expose that data type from App A (main) settings and then be able to select it from the app connector under add a call / Installed calls and then use it in elements within App B (sub) like any other ‘do a search’.

  1. For each call in step 7, select ‘Action’ in ‘use as’ for workflows and ‘Data’ for pulling a data type.

For both workflows and data, typically set authentication as ‘OAuth’ as this requires user signup and sets access through roles defined in the Privacy Settings of the app while ‘API Key’ grants admin access and ‘none’ gives bare minimum access. (see Introduction - Bubble Docs for more details)

25 Likes

Thank you @neerja for the detailed guide to do this. :+1:

I will do it and I will post back how it goes with me.

Hi @neerja

I have two points:

1- On Step 2: In App A settings > API tab When I try to add the Redirect URI which you said should be the landing page back, of the App B, every time I put the landing page back, for example: https://SubAppB.bubbleapps.io/version-test/landing

and then I click on the OAuth button that on the login page called" dashboard-login" it gives me this error:
{“statusCode”:400,“message”:“Invalid redirect_uri: https://SubAppB.bubbleapps.io/version-test/dashboard-login”}

Although, the dashboard-login page is where the OAuth Button was clicked, not the Redirect URI as it says in the error.
Do you know why is that?

2- On the step 2, it seem I would have to add a new 3rd party app for every Subapp, which isn’t a realistic way. All the subapps will be replicas of the main app so they all would have the same Redirect URI destination but not the main domain.
If I have 100 sub apps, does that mean I would need to add a 100 times the 3rd party app on the Settings/API tab?
If it is true there must be a way to go around this.

1 Like

For the landing page, try https://SubAppB.bubbleapps.io/version-test/ and if that still doesn’t work, send your app names to support and I can take a look.

Yes, you would have to add each sub-app individually and each sub-app will have it’s own login button that uses main app’s credentials and then redirects to the sub. This is why in our initial conversations we recommended using one app for all storefronts.

I tried it, it didn’t work, I sent a message to support.

Thanks

Based on your apps, it looks like you are following the steps a bit differently which explains why it didn’t work for you. I have shared test app copies with you to make it easier to compare.

It is clear to me now,

Thank you for your help in this matter

I followed the steps exactly, but when I click the login button in App B, it goes to the login page in app A (as it should) but then gets stuck in a loading loop.

I just put the email pasword fields on the page and a login button that only logs the user in on click.

When I click abort in the browser I can enter my credentials, the progress bar starts running but nothing happens. The server log for App A says a user logged in but nothing happened on the front end.

for redirect uri I used App B’s url (…/version-test as well as /version-test/index)

There are no workflows on the page or in the login action that would trigger this, the page is completely empty. So could it be that I need to change something to the privacy settings of the User data type?

Currently, only logged in users with certain roles can see the User object. Everyone else = empty. (Actually, just tested this but same result)

If this is insufficient information to work with please let me know but perhaps this is something that rings a bell!

Sounds like something incorrect with the redirect url. Send your app links to support and we’ll take a look.

The issue is that if your authenticating (main) app has a custom domain, use that custom domain instead of appname.bubbleapps.io in the app connector plugin.

I am using my custom domain in the app connector in app B.

A related question: I have some rules setup depending on the current user’s role. Will that still be in effect in App B? Because I also see something like: Current User’s AppA user. Should I reference that user instead?

For some reason, it now works and there is no loop anymore. Strange! I do think I have to redo all my security rules as they are based on current user and not current user’s main app user.

man i do wonder if it is easier to make a copy of the data in app B as opposed to pulling app A data into App B :confused:

This topic was automatically closed after 70 days. New replies are no longer allowed.