How can I set up SSO with Azure AD and our back end strapi?

Question

I am wondering if anyone has done this before,

I have an azure Active Directory, and I host the front end of our app in IIS. The back is controlled by pm2. How can I set up SSO with Azure AD and our back end strapi?

Thank you for any help

Answer 1

Strapi supports natively Microsoft SSO.

You must act on three fronts: Azure Portal, Strapi Admin, Frontend App

1 - AZURE Portal: (create application, configure, get params)

1.1 Create application, go to the App registrations site and register an app

1.2 Click New Registration

1.3 Fill the form as show in below ScreenShot

1.3.1 In "Supported account types" set Multitenant option (in strapi, single tenant is not supported by default, if you need to set single tenant you must create a custom provider, but multitenant is ok)

1.3.2 In the Redirect URI field, put "Web" and

/connect/microsoft/callback

(i.e. http://localhost:1337/connect/microsoft/callback or your strapi
production url https://mystrapiexample.com/connect/microsoft/callback)

1.3.3 Register and go to next page

1.4 Go to the "Authentication" page of your registered App (left menu) to enable the implicit grant flow (Access tokens)

1.5 Go to the "Certificate and secrets" page of your registered App (left menu) to create a "New client secret" and annotate the value, You will use it when you configure the provider on strapi.

1.6 Also note the "Application (client) ID" in the Overview page, You will use it when you configure the provider on strapi

2 - STRAPI ADMIN: (create application, configure, get params)

2.1 Go to "Roles and Permission" > Providers > Microsoft

2.2 Set Enable "ON" and your clientId and secret that you get in previous steps (1.5 and 1.6)

2.3 The redirect URI to your front-end app which gets and redirects the microsoft access_code (this step will be clearer later)

3 - FRONTEND APP:

Ready? At this point the flow begins, starts to jump to complete the authentication and obtain a strapi jwt to make the requests as an authenticated user.

3.1 Create a link in your frontend application to strapi microsoft sign-in

/connect/microsoft

(i.e. http://localhost:1337/connect/microsoft or your strapi
production url https://mystrapiexample.com/connect/microsoft)

3.2 Strapi redirects the user to microsoft authentication page, on success the user will be redirected on strapi with a microsoft access_code (this step is transparent for you)

3.3 Strapi redirects the access_code to the frontend url set in 2.3, which must redirect (with access_code) to strapi page auth

/auth/microsoft/callback

(i.e http://localhost:1337/auth/microsoft/callback or your strapi
production url https://mystrapiexample.com/auth/microsoft/callback ).....

3.4 At this point strapi creates its own JWT token which returns to the frontend application, which can store it (in localstorage, session storage...) to make requests to the strapi endpoints.

References

• https://github.com/strapi/strapi-examples/blob/master/login-react/doc/microsoft_setup.md
• https://docs.microsoft.com/en-us/azure/active-directory/develop/quickstart-register-app
• https://docs.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-implicit-grant-flow