How to build Microsoft Entra ID OIDC enterprise SSO with .NET Core (Blazor Server)

给我们的新朋友:

Logto 是一个为现代应用和 SaaS 产品设计的 Auth0 替代方案。它提供 Cloud 和开源服务，帮助你快速启动身份和管理 (IAM) 系统。享受认证 (Authentication)、授权 (Authorization) 和多租户管理一体化。

我们建议从 Logto Cloud 上的免费开发租户开始。这可以让你轻松探索所有功能。

在本文中，我们将介绍使用 .NET Core (Blazor Server) 和 Logto 快速构建 Microsoft Entra ID OIDC enterprise SSO 登录体验（用户认证 (Authentication)）的步骤。

先决条件

一个正在运行的 Logto 实例。查看介绍页面以开始。
.NET Core (Blazor Server) 的基本知识。
一个可用的 Microsoft Entra ID OIDC enterprise SSO 账户。

Create an application in Logto

Logto 基于 OpenID Connect (OIDC) 认证 (Authentication) 和 OAuth 2.0 授权 (Authorization)。它支持跨多个应用程序的联合身份管理，通常称为单点登录 (SSO)。

要创建你的传统网页应用程序，只需按照以下步骤操作：

打开 Logto Console。在“开始使用”部分，点击“查看全部”链接以打开应用程序框架列表。或者，你可以导航到 Logto Console > Applications，然后点击“创建应用程序”按钮。
在打开的模态窗口中，点击“传统网页”部分，或使用左侧的快速过滤复选框过滤所有可用的“传统网页”框架。点击 ".Net Core (Blazor Server)" 框架卡片以开始创建你的应用程序。
输入应用程序名称，例如“Bookstore”，然后点击“创建应用程序”。

🎉 太棒了！你刚刚在 Logto 中创建了你的第一个应用程序。你将看到一个祝贺页面，其中包含详细的集成指南。按照指南查看你的应用程序中的体验将会是什么样的。

Integrate .Net Core (Blazor Server) SDK

提示:

以下演示基于 .NET Core 8.0 构建。该 SDK 兼容 .NET 6.0 或更高版本。
.NET Core 示例项目可在 GitHub 仓库中找到。

安装

将 NuGet 包添加到你的项目中：

dotnet add package Logto.AspNetCore.Authentication

添加 Logto 认证 (Authentication)

打开 Startup.cs（或 Program.cs）并添加以下代码以注册 Logto 认证服务：

Program.cs
using Logto.AspNetCore.Authentication;

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddLogtoAuthentication(options =>
{
  options.Endpoint = builder.Configuration["Logto:Endpoint"]!;
  options.AppId = builder.Configuration["Logto:AppId"]!;
  options.AppSecret = builder.Configuration["Logto:AppSecret"];
});

AddLogtoAuthentication 方法将执行以下操作：

将默认认证方案设置为 LogtoDefaults.CookieScheme。
将默认挑战方案设置为 LogtoDefaults.AuthenticationScheme。
将默认注销方案设置为 LogtoDefaults.AuthenticationScheme。
将 cookie 和 OpenID Connect 认证处理程序添加到认证方案中。

在我们继续之前，需要澄清 .NET Core 认证中间件中的两个容易混淆的术语：

CallbackPath：用户登录后，Logto 将用户重定向回来的 URI（在 Logto 中称为“重定向 URI”）
RedirectUri：在 Logto 认证中间件中完成必要操作后，将重定向到的 URI。

登录过程可以如下图所示：

类似地，.NET Core 也有用于注销流程的 SignedOutCallbackPath 和 RedirectUri。

为了清晰起见，我们将它们称为：

我们使用的术语	.NET Core 术语
Logto 重定向 URI	CallbackPath
Logto 注销后重定向 URI	SignedOutCallbackPath
应用程序重定向 URI	RedirectUri

此认证 (Authentication) 过程遵循 OpenID Connect (OIDC) 协议，Logto 强制执行严格的安全措施以保护用户登录。
如果你有多个应用程序，可以使用相同的身份提供商 (IdP)（日志 (Logto)）。一旦用户登录到一个应用程序，当用户访问另一个应用程序时，Logto 将自动完成登录过程。

要了解有关基于重定向的登录的原理和好处的更多信息，请参阅 Logto 登录体验解释。

配置重定向 URI

备注:

在以下代码片段中，我们假设你的应用程序运行在 http://localhost:3000/。

首先，让我们配置 Logto 重定向 URI。将以下 URI 添加到 Logto 应用详情页面的“重定向 URI”列表中：

http://localhost:3000/Callback

要配置 Logto 签出后重定向 URI，请将以下 URI 添加到 Logto 应用详情页面的“签出后重定向 URI”列表中：

http://localhost:3000/SignedOutCallback

更改默认路径

Logto 重定向 URI 的默认路径是 /Callback，而 Logto 签出后重定向 URI 的默认路径是 /SignedOutCallback。

如果没有特殊要求，你可以保持原样。如果你想更改它，可以为 LogtoOptions 设置 CallbackPath 和 SignedOutCallbackPath 属性：

Program.cs
builder.Services.AddLogtoAuthentication(options =>
{
  // 其他配置...
  options.CallbackPath = "/Foo";
  options.SignedOutCallbackPath = "/Bar";
});

记得在 Logto 应用详情页面中相应地更新值。

添加路由

由于 Blazor Server 使用 SignalR 在服务器和客户端之间进行通信，这意味着直接操作 HTTP 上下文的方法（如发起挑战或重定向）在从 Blazor 组件调用时无法按预期工作。

为了正确实现，我们需要显式添加两个用于登录和注销重定向的端点：

Program.cs
app.MapGet("/SignIn", async context =>
{
    if (!(context.User?.Identity?.IsAuthenticated ?? false))
    {
        await context.ChallengeAsync(new AuthenticationProperties { RedirectUri = "/" });
    } else {
        context.Response.Redirect("/");
    }
});

app.MapGet("/SignOut", async context =>
{
    if (context.User?.Identity?.IsAuthenticated ?? false)
    {
        await context.SignOutAsync(new AuthenticationProperties { RedirectUri = "/" });
    } else {
        context.Response.Redirect("/");
    }
});

现在我们可以重定向到这些端点以触发登录和注销。

实现登录 / 登出按钮

在 Razor 组件中，添加以下代码：

Components/Pages/Index.razor
@using Microsoft.AspNetCore.Components.Authorization
@using System.Security.Claims
@inject AuthenticationStateProvider AuthenticationStateProvider
@inject NavigationManager NavigationManager

@* ... *@

<p>是否认证 (Is authenticated): @User.Identity?.IsAuthenticated</p>
@if (User.Identity?.IsAuthenticated == true)
{
    <button @onclick="SignOut">登出</button>
}
else
{
    <button @onclick="SignIn">登录</button>
}

@* ... *@

@code {
    private ClaimsPrincipal? User { get; set; }

    protected override async Task OnInitializedAsync()
    {
        var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
        User = authState.User;
    }

    private void SignIn()
    {
        NavigationManager.NavigateTo("/SignIn", forceLoad: true);
    }

    private void SignOut()
    {
        NavigationManager.NavigateTo("/SignOut", forceLoad: true);
    }
}

说明：

注入的 AuthenticationStateProvider 用于获取当前用户的认证状态，并填充 User 属性。
SignIn 和 SignOut 方法用于分别将用户重定向到登录和登出端点。由于 Blazor Server 的特性，我们需要使用 NavigationManager 并强制加载以触发重定向。

如果用户未认证，页面将显示“登录”按钮；如果用户已认证，则显示“登出”按钮。

`<AuthorizeView />` 组件

或者，你可以使用 AuthorizeView 组件根据用户的认证状态有条件地渲染内容。当你想向已认证和未认证用户显示不同内容时，这个组件非常有用。

在你的 Razor 组件中，添加以下代码：

Components/Pages/Index.razor
@using Microsoft.AspNetCore.Components.Authorization

@* ... *@

<AuthorizeView>
    <Authorized>
        <p>名称：@User?.Identity?.Name</p>
        @* 已认证用户的内容 *@
    </Authorized>
    <NotAuthorized>
        @* 未认证用户的内容 *@
    </NotAuthorized>
</AuthorizeView>

@* ... *@

AuthorizeView 组件需要一个类型为 Task<AuthenticationState> 的级联参数。获取此参数的直接方法是添加 <CascadingAuthenticationState> 组件。然而，由于 Blazor Server 的特性，我们不能简单地将组件添加到布局或根组件（可能无法按预期工作）。相反，我们可以在构建器中添加以下代码（Program.cs 或 Startup.cs）来提供级联参数：

Program.cs
builder.Services.AddCascadingAuthenticationState();

然后你可以在每个需要的组件中使用 AuthorizeView 组件。

检查点：测试你的应用程序

现在，你可以测试你的应用程序：

运行你的应用程序，你将看到登录按钮。
点击登录按钮，SDK 将初始化登录过程并将你重定向到 Logto 登录页面。
登录后，你将被重定向回你的应用程序，并看到登出按钮。
点击登出按钮以清除令牌存储并登出。

Add Microsoft Entra ID OIDC enterprise SSO connector

To simplify access management and gain enterprise-level safeguards for your big clients, connect with .Net Core (Blazor Server) as a federated identity provider. The Logto enterprise SSO connector helps you establish this connection in minutes by allowing several parameter inputs.

To add an enterprise SSO connector, simply follow these steps:

Navigate to Logto console > Enterprise SSO.

SSO page

Click "Add enterprise connector" button and choose your SSO provider type. Choose from prebuilt connectors for Microsoft Entra ID (Azure AD), Google Workspace, and Okta, or create a custom SSO connection using the standard OpenID Connect (OIDC) or SAML protocol.
Provide a unique name (e.g., SSO sign-in for Acme Company).

Select your SSO provider

Configure the connection with your IdP in the "Connection" tab. Check the guides above for each connector types.

SSO connection

Customize the SSO experience and enterprise’s email domain in the "Experience" tab. Users sign in with the SSO-enabled email domain will be redirected to SSO authentication.

SSO experience

Save changes.

Set up Azure AD SSO 应用程序

步骤 1：创建 Microsoft EntraID OIDC 应用程序

前往 Microsoft Entra 管理中心并以管理员身份登录。
浏览到 Identity > Applications > App registrations。

选择 New registration。
输入应用程序名称，并为你的应用程序选择适当的账户类型。
选择 Web 作为应用程序平台。
从 Logto 的 SSO 设置页面复制并粘贴 redirect URI。redirect URI 是用户在通过 Microsoft Entra ID 认证后被重定向的 URL。

点击 Register 创建应用程序。

步骤 2：在 Logto 配置 Microsoft Entra ID OIDC 单点登录 (SSO)

成功创建 Microsoft Entra OIDC 应用程序后，你需要将 IdP 配置提供给 Logto。在 Logto 控制台中导航到 Connection 选项卡，并填写以下配置：

Client ID：由 Microsoft Entra 分配给你的 OIDC 应用程序的唯一标识符。Logto 使用此标识符在 OIDC 流程中识别和认证 (Authentication) 应用程序。你可以在应用程序概览页面找到它，标识为 Application (client) ID。

Client Secret：创建一个新的客户端密钥，并将其值复制到 Logto。此密钥用于认证 (Authentication) OIDC 应用程序并保护 Logto 与 IdP 之间的通信。

发行者 (Issuer)：发行者 URL，是 IdP 的唯一标识符，指定可以找到 OIDC 身份提供商 (IdP) 的位置。它是 OIDC 配置的重要组成部分，因为它帮助 Logto 发现必要的端点。

Logto 不需要手动提供所有这些 OIDC 端点，而是自动获取所有必需的配置和 IdP 端点。这是通过利用你提供的发行者 URL 并调用 IdP 的发现端点来完成的。

要获取发行者 URL，你可以在应用程序概览页面的 Endpoints 部分找到它。

找到 OpenID Connect metadata document 端点并复制 URL 不包括末尾路径 .well-known/openid-configuration。这是因为 Logto 在获取 OIDC 配置时会自动将 .well-known/openid-configuration 附加到发行者 URL。

权限 (Scope)：一个以空格分隔的字符串列表，定义 Logto 在 OIDC 认证 (Authentication) 过程中请求的所需权限或访问级别。scope 参数允许你指定 Logto 从 IdP 请求哪些信息和访问权限。

scope 参数是可选的。无论自定义 scope 设置如何，Logto 始终会向 IdP 发送 openid、profile 和 email 权限 (Scopes)。

点击 Save 完成配置过程。

步骤 3：设置电子邮件域并启用 SSO 连接器

在连接器 体验 (Experience) 选项卡中提供你组织的电子邮件 域。这将启用 SSO 连接器作为这些用户的认证 (Authentication) 方法。

在指定域中的电子邮件地址的用户将被专门限制为仅使用你的 SSO 连接器作为他们的唯一认证 (Authentication) 方法。

Save your configuration

仔细检查你是否在 Logto 连接器配置区域填写了必要的值。点击“保存并完成”（或“保存更改”），Microsoft Entra ID OIDC enterprise SSO 连接器现在应该可用了。

You don’t need to configure enterprise connectors individually, Logto simplifies SSO integration into your applications with just one click.

Navigate to: Console > Sign-in experience > Sign-up and sign-in.
Enable the "Enterprise SSO" toggle.
Save changes.

Once enabled, a "Single Sign-On" button will appear on your sign-in page. Enterprise users with SSO-enabled email domains can access your services using their enterprise identity providers (IdPs).

Auto detect SSO sign-in via email domain

To learn more about the SSO user experience, including SP-initiated SSO and IdP-initiated SSO, refer to User flows: Enterprise SSO.

Testing and Validation

返回到你的 .NET Core (Blazor Server) 应用。你现在应该可以使用 Microsoft Entra ID OIDC enterprise SSO 登录了。享受吧！

Create an application in Logto​

Integrate .Net Core (Blazor Server) SDK​

安装​

添加 Logto 认证 (Authentication)​

登录 / 登出流程​

关于基于重定向的登录​

配置重定向 URI​

更改默认路径​

添加路由​

实现登录 / 登出按钮​

<AuthorizeView /> 组件​

检查点：测试你的应用程序​

Add Microsoft Entra ID OIDC enterprise SSO connector​

Set up Azure AD SSO 应用程序​

步骤 1：创建 Microsoft EntraID OIDC 应用程序​

步骤 2：在 Logto 配置 Microsoft Entra ID OIDC 单点登录 (SSO)​

步骤 3：设置电子邮件域并启用 SSO 连接器​

Save your configuration​

Enable Microsoft Entra ID OIDC enterprise SSO connector in Sign-in Experience​

Testing and Validation​

Further readings​