Adding Microsoft Authentication to Dash App

Dash Python
1

Hello, I am a complete beginner and this is my first time posting. Every comment or input is appreciated!

I have a dash app and I have deployed it to AWS Lambda and AWS API Gateway. It works fine. Now, I want to add a Microsoft Authentication to my app. What I imagining is that when someone visit my web app, they have to log in to Microsoft (SSO) first.

I have tried to integrate my dash app with Flask server and use Flask Dance to create Azure blueprint and it works locally. But during deployment, it seems that it just doesn’t work and I get a web page that stuck in “Loading…” It seems that maybe there is problem because there is Flask server and simultaneously AWS server? I am confused.

Maybe someone has experience about this? Or is there maybe other ways to add the authentication? Thanks!

2

Hey @lyaprrseux, I’ve created a PR in dash-auth to add OIDC authentication, which will allow Microsoft SSO auth. The review is still ongoing but hopefully that will be available soon as part of the standard library!

4 Likes
3

That’s awesome! Just out of curiosity, does your PR handle user authorization as well or is it primarily built around authentication?

Edit: Also, when do you anticipate that this PR will be merged?

4

It’s up to the Plotly team now, can’t say for sure.

I’m not sure what you mean by Authorisation with SSO, dash-auth already allows Basic auth.

5

Ah sorry, was trying to ask whether there’s a way to handle something along the lines of RBAC for accessing certain pages based on the user.

6

Right, yes I also added some primitives to manage groups/roles in that PR :slight_smile:

2 Likes
7

A post was split to a new topic: :mega: New release v2.3.0 of dash-auth

8

I implemented Microsoft Authentication using Azure B2C, but I did it all client-side so there is no conflict when multiple users are simultaneously using the app. You can achieve that using clientside callbacks and using the JavaScript msal library.

It’s not very straightforward to set up. If you are looking for this, I can make an attempt to explain what I did.

9

tl;dr; I’ve written a tutorial on integrating Microsoft Entra ID (Azure AD) with Dash.

I have extensive experience implementing auth mechanisms for Dash, and my best advice is to separate the Dash app from the authentication layer. Instead of using MSAL (or any other auth library) directly into your Dash app, you can write a reverse proxy to handle the authentication and forward the authenticated users to Dash:

image
image761Ă—221 7.71 KB

Keeping the logic separate simplifies things because you don’t need to modify your Dash code (plus, it’ll work with other frameworks such as Streamlit, Shiny, etc.) Otherwise, you’ll need to implement the authentication logic on every app you deploy.

1 Like
10

Do you have an example where the application accesses a protected API from server and/or client? :blush:

11

I know you said AWS but just wanted to throw it out there that Azure App Service has the authentication built in for several providers like Microsoft, Google, GitHub, etc.

Here is some additional information in case you are curious: Configure Microsoft Entra authentication - Azure App Service | Microsoft Learn.