How do I add Microsoft sign in to a B2B app?

To add Microsoft sign-in to a B2B app, you typically use Microsoft Entra ID (formerly Azure AD) as the identity provider and implement OpenID Connect / OAuth 2.0.

1) Decide the sign-in model

For B2B apps, common options are:

• Single-tenant: only users from your own Entra tenant can sign in.
• Multi-tenant: users from other Microsoft 365/Entra tenants can sign in.
• B2B collaboration: external users are invited as guests into your tenant.

If you want “Sign in with Microsoft” for business customers, you usually want multi-tenant.

---

2) Register the app in Microsoft Entra

Go to Azure portal / Entra admin center:

1. Open Microsoft Entra ID

2. Go to App registrations

3. Click New registration

4. Set:

   • Name
   • Supported account types:
     • Accounts in any organizational directory for B2B/multi-tenant
     • or single tenant if only your org
   • Redirect URI:
     • Web app: https://yourapp.com/auth/callback
     • SPA: https://yourapp.com/
     • Mobile/Desktop: native redirect URI

5. Save the Application (client) ID

6. Create a Client Secret if your app is a backend/web app

   • For SPA/mobile, don’t use a secret

---

3) Configure permissions/scopes

Most sign-in flows need:

• openid
• profile
• email
• offline_access (if you need refresh tokens)

If your app calls Microsoft APIs:

• Add Microsoft Graph permissions like User.Read

Then grant consent if needed.

---

4) Use the Microsoft authentication libraries

Microsoft recommends using the Microsoft Authentication Library (MSAL).

For web apps

Use:

• MSAL.js for frontend
• MSAL Node / .NET / Java / Python for backend, depending on stack

Example auth endpoints

You’ll redirect users to Microsoft’s authorize endpoint, then handle the callback:

• https://login.microsoftonline.com/{tenant}/oauth2/v2.0/authorize
• https://login.microsoftonline.com/{tenant}/oauth2/v2.0/token

For multi-tenant sign-in, often use:

• {tenant} = common
• or organizations for work/school accounts only

---

5) Add the sign-in button

Typical UX:

• “Sign in with Microsoft”
• “Continue with Microsoft”

When clicked, start the MSAL login flow.

---

6) Validate the token on your backend

After login, your app receives an ID token and/or access token.

On the backend, verify:

• token signature
• issuer
• audience (aud)
• expiration
• tenant ID (tid)
• user identity claims (oid, preferred_username, etc.)

Then create your local session.

---

7) Handle B2B specifics

If you’re allowing external business users:

• Use multi-tenant app registration
• Be ready to handle users from other tenants
• Optionally restrict access by:
  • allowed tenant IDs
  • email domain allowlist
  • invite-only access
• If needed, use guest invitations in your tenant

---

8) Optional: Use Entra External ID

If your “B2B app” means external customers/partners, you might also look at:

• Microsoft Entra External ID
• This is the newer direction for external identity scenarios

It’s especially useful if you need:

• customer-facing login
• social login + Microsoft login
• custom branded sign-in pages

---

Example flow

1. User clicks Sign in with Microsoft
2. Redirect to Microsoft login
3. User authenticates
4. Microsoft returns an auth code to your redirect URI
5. Your app exchanges code for tokens
6. Your app validates token and signs user in locally

---

What I need from you to give exact steps

Tell me:

1. Your app type: React / Angular / Vue / .NET / Node / Python / mobile
2. Whether it’s single-tenant or multi-tenant
3. Whether users are employees/partners (B2B) or customers (B2C-like)
4. Whether you want frontend-only login or backend session-based login

Then I can give you a copy-paste setup and code example.