Connecting Bubble apps using OAuth2 User-Agent Flow + API Connector

Does anyone know if it’s possible to connect multiple Bubble apps together using OAuth2 User-Agent Flow in the API Connector plugin?

Setup:

There is a primary app that acts as an OAuth2 portal (contains profile data, SSO Client ID and Client Secret) – this app is logged into from a variety of other Bubble apps (each identical in structure, as they spawn as sub apps from a parent app). Currently, users can easily view data from this primary app within all non-primary apps by referencing Bubble App Connector workflows I’ve created (basically 1-way communication from non-primary up to primary) Users need the ability to view a list of all non-primary apps they have access to from within the primary app (2-way communication). Right now I can pull this data by connecting to the non-primary apps with API keys in the API Connector, but this opens up huge security risks since the API keys are essentially open admin access. I’d like to connect using OAuth2 so that privacy rules apply to the users and the data they are attempting to access.

I am unable to use the Bubble App Connector for this purpose because it would require the creation of new app connections for each new non-primary app that’s created (an unrealistic scenario).

If anyone knows how to fill out these fields for Bubble-to-Bubble OAuth app communication I’d really appreciate the support.

Questions that come to mind:

  • Are App ID and App Secret the same as my primary app’s Client ID and Client Secret?
  • What scope do I need and how do I obtain this information?
  • Does Authentication need to go in the header?
  • What is the Token name, and do I need one in order to make this connection happen? If a token is required, does it need returned as a querystring?
  • Does Bubble-to-Bubble OAuth use the refresh token mechanism? How about Basic Auth?
  • I am filling out this data from WITHIN the primary app that contains the OAuth user, is a login redirect/token endpoint/profile endpoint required? What would these values looks like?
  • When I return data from non-primary apps using API keys and look for email data, it is nested in “authentication → email → email”, how is this translated into an “Email key path”?

I’m sure there is more I am missing, any insights would be helpful at this point. I’ve attempted doing this myself and am getting nowhere.

Hello,

This is supposed to work out of the box. since it’s from bubble to bubble, you don’t need to worry about scopes, etc (at least at this stage).

You can generate and find the keys in the API section of the settings tab. Once this is done, you’ll be able to pick the app in the Sign up with Oauth action. Then you should use the App Connector, not the API connector, which handles all of this automatically in a user friendly manner.

https://manual.bubble.is/using-plugins/special-plugins.html#the-bubble-app-connector

This is what I am unable to do based on the circumstances.

Scenario is:

Primary OAuth portal app - eg: oauthportal.com

Primary Parent Bubble app - eg: parentapp.com

Sub apps are spawned off the Primary- eg: subapp1.parentapp.com, subapp2.parentapp.com, subapp3 etc…

Users login to their respective subapp and are routed to the OAuth app eg: oauthportal.com and after logging in they are taken back to their subapp. This is all working using the Bubble App Connector.

What I am needing to do is create a primary location in the OAuth app where each subapp and its data can be accessed via API while users are logged in. This would be very simple if we were dealing with a single app, because I could use the Bubble App Connector, connect to this single subapp from within the plugin settings at oauthportal.com and then create a page where this subapp and its data can be accessed securely.

oauthapp.com/subappdata-uniqueidhere065538x14222333366123080 should be the structure. When a user validates they own the subapp this data would be pulled in to populate a new data thing of a certain type eg: /subappdata-uniqueidhere

What I can not do is add each subapp individually, because then I would have to create custom API calls for EACH app I’m connecting to and then manually create a page (eg: oauthapp.com/subapp1) building input fields and text boxes from scratch, reconnecting to these API calls afterwards. The worst part of this method is that I would then have to go through and edit dozens or hundreds of copies of API calls if I had 1 change to make. If a page layout design changes, I would then have to go through and edit dozens or hundreds of individual pages. Think of it like WordPress custom post types: I am trying to build an archive of subapps, where each subapp also has a page with more data about that subapp (the post).

I have gotten pretty far using API keys in order to access this data dynamically (I can serve up the subapp URL in pieces and construct a query in the API Connector) but this negates the security of OAuth and following user role privacy permissions. Essentially I need help recreating this kind of GET/POST behavior with Bubble OAuth inside the API Connector.

I see sorry I missed that part. Well unfortunately we don’t have a good way to do this currently.

Hi @philip & @emmanuel

I have a similar need to this.
I’m currently on the Team plan, and I have a Main App which will have many Sub Apps that are identical to this main app. What I’m trying to do is similar to your use case where I want to connect users of sub apps to the main app to make users login to their respective subapp and to unified the login/signup system.

If you don’t mind, did you find a way to achieve what your were looking for?