OAuth Microsoft SSO with Bubble.io

I am trying to create a SSO button for my bubble app, so our users can log via their company Microsoft Account.
I don’t want to use plugins, as I am concerned about making this secure and independent from 3rd party providers.
I found some Youtube videos I plan to explore, but does anybody has done it before? Can you recommend what is the easiest way to do it? Is there any user friendly tutorial out there?

Hey @michal.friedrich,

This is what my Microsoft setup looks like:

2 Likes

Johny, it’s looks beyond awesome, I will try this right away!

What else do you have in this scope, as I am trying to copy what you have and add my keys.

I have: openid offline_access email profile User.Read

Thanks. I get some redirect error, but I will clear it out with my admin, maybe he will help. Thanks! Hope to give some good news I got it running!

BTW. Do I need to setup anything apart from signup login with API? Like linking it somehow to database or creating additional step via login? As not everybody should be able to log in there, only people with accounts in my app.

Nope. A few things to note:

  • When you add your login to Microsoft button it’ll create a new account for a user that doesn’t exist already in the database with the email used
  • If there’s already a user with the Microsoft email in the db, they’ll need to log in as usual with email + pw, then you need to add a button for them to connect their Microsoft account

But does it mean this login button has a function of register buttton - meaning anybody can register to the app (of course without any privacy settings)? As I am just looking for a login, no register process.
I already have users, who have their emails in the database, and they are the same ones I will use the SSO.

That’s not really possible. Bubble automatically handles login and sign up with oauth. But my setup for one of my apps is (it runs on Google oauth though – but i imagine its pretty similar) is that the OAuth consent only allows for people within my org. It doesn’t really matter to me if existing people in my org “login with google” and it creates them an account because they cant view anything by default without having perms added.

So you’ll have to still allow them to log in with email + pw, then force them upon next login to sign in with Microsoft so the next time they can just sign in with Microsoft

Thanks for help @johnny!
This really works.
Also - no problem with SSO, as only people from our tennant can log in, just those without permission will see nothing.

Just one followup question.
This method is great for creating and then loging a user.
But what if I already have users who have created some things - and I would like to make them possible to log in via SSO. When their email is in the database - they cannot sso until I delete them first.
But maybe - there is a way to match something within the database, that they will be able to start to use the SSO on already active account.

Hey guys, thanks for the thread. How do you handle account passwords in these situations? I’ve used Facebook and Google via the Bubble plugins for this via Bubble’s workflow for signing a user up via a social network.

Or will your above API call show up as an option in that ‘sign the user up via a social network’ workflow and thus, @johnny your API call setup screenshot you’ve generously shared is all one really needs? I’ve done all the setup in Azure but have one question about the ‘User email key path’, where does that come from or I just copy the value shown? Thanks mucho mucho!

Correct

By using the “Sign the user up via social network” action, it sets the user password as the one it gets from the OAuth call

@johnny thanks for confirming, didn’t know that’s how it works

Ohh that dopamine rush when you finally crack through to the other siiiide

2 Likes

love it!

@johnny Could you explain how this connection would work? Right now all I can see is login/signup which wouldn’t work… all I want is for users to be able to login and provide an authentication code so that the app can create a Teams meeting

What are you confused about? What are you trying to do? I’m not super familiar with Microsoft more of a Google Workspace user :sweat_smile:

Lol dont worry I got it working, I do seem to be struggling with the Teams API refusing to accept dynamic data but it’ll accept the same data if it’s static plain text - not sure if you know anything about this?

Honestly, I don’t know much about Teams