Azure-Samples / ms-identity-python-webapp

A Python web application calling Microsoft graph that is secured using the Microsoft identity platform
MIT License
279 stars 133 forks source link

Login through SSO #146

Open mirojs opened 1 month ago

mirojs commented 1 month ago

Hello,

The app I'm working on has two frontends, one React, the other Python (Streamlit).

For the React one, authentication/authorization had already been done using Entra External ID (login/ out working with login/out workflow). And for the python (Streamlit) one, login through SSO is preferred because the token was already there in the session cookie.

After reading through the documents, however, only normal login methods could be found instead of SSO. Could anyone direct me to the right document or I simply need to take part of the code from the current normal login method?

BTW, I also checked the SSO setting under the enterprise app registration in the Entra console, there didn't seem to be anything that needed to be configured for External Tenant based app.

Please kindly direct me to the right direction. Thanks for your help in advanced!

rayluo commented 1 month ago

For your react frontend, did you use MSAL.js to handle the login? For the Python (Streamlit) one, we do not currently have a sample for it. In general, different apps probably do not share their login state; however, your browser will probably maintain its session cookie for the same login.microsoftonline.com site, so SSO can happen there, for free. (It means each app might still trigger its login experience, but the end user does not really need to type in their username and password again on login.microsoftonline.com.)

If you have further question, please elaborate and your "reading through the documents" comment shall better be accompanied with its URL so that we would know precisely what method you were talking about.

mirojs commented 1 month ago

Thanks for the quick response and sorry for missing the reference.

I'd followed most part of this tutorial from part I to the Part 4, https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-single-page-app-react-sign-in-prepare-tenant, and the Login worked eventually. And the SSO part could be found here in Part 2: https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-single-page-app-react-sign-in-prepare-app

For the Python frontend, I'm studying the counterpart tutorial as in the following: https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-web-app-python-flask-prepare-tenant

But the SSO were not available.

The login experience mentioned in the reply was exactly the one I were looking for. In order to make the SSO happen, would you mind helping finding Entra External ID documentation on this or a few lines of code that could possibly work for my case?

Thanks!

rayluo commented 1 month ago

For the Python frontend, I'm studying the counterpart tutorial as in the following: https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-web-app-python-flask-prepare-tenant

You used a keyword studying in your message. Were you able to actually get it working? FWIW, there is a counterpart of counterpart :-) available here, with less typing needed on your side, so less likely to go wrong. You may use that to at least get the sign-in experience working first.

But the SSO were not available.

I did not personally use the react sample before. Theoretically speaking, if your two apps use same authority URL, the SSO shall happen without any special setting on your end. Can you double check your authorities used in both apps?

mirojs commented 1 month ago

Thanks for the counterpart square reference :)

In terms of the authority URL, I noticed for the React tutorial (https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-single-page-app-react-sign-in-prepare-app), It's authority: 'https://Enter_the_Tenant_Subdomain_Here.ciamlogin.com/', but for the Python one (https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-web-app-python-flask-sign-in-sign-out?tabs=windows), it's AUTHORITY=https://.ciamlogin.com/.onmicrosoft.com

As could be seen, they were different. Would this be an issue or I need to use the same one for both of them?

BTW, for Streamlit app, should it be set as Web App or SPA in the app registration?

Thanks!

rayluo commented 1 month ago

Counterpart2 ...

LOL

for the Python one (https://learn.microsoft.com/en-us/entra/external-id/customers/tutorial-web-app-python-flask-sign-in-sign-out?tabs=windows), it's AUTHORITY=https://.ciamlogin.com/.onmicrosoft.com

Python sample needs that path for its logout feature to work. But that shouldn't matter. What matters to SSO is the actual URL in your browser when a user is signing in. I would suggest you do this investigation for both of your apps. You may need to logout first so that you can land on the actual sign-in page. (With the Python web app sample, you will see 2 sign-in pages. The second one - the real one from your CIAM tenant - counts.)