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

新しい友達のために:

Logto は、モダンなアプリや SaaS 製品向けに設計された Auth0 の代替です。 Cloud とオープンソースの両方のサービスを提供し、アイデンティティと管理 (IAM) システムを迅速に立ち上げるのをサポートします。認証 (Authentication)、認可 (Authorization)、マルチテナント管理をすべて一つにまとめて楽しめます。

Logto Cloud で無料の開発テナントから始めることをお勧めします。これにより、すべての機能を簡単に探索できます。

この記事では、.NET Core (Blazor Server) と Logto を使用して、Microsoft Entra ID SAML enterprise SSO サインイン体験（ユーザー認証 (Authentication)）を迅速に構築する手順を説明します。

前提条件

実行中の Logto インスタンス。始めるには紹介ページをご覧ください。
.NET Core (Blazor Server) の基本的な知識。
使用可能な Microsoft Entra ID SAML enterprise SSO アカウント。

Create an application in Logto

Logto は OpenID Connect (OIDC) 認証 (Authentication) と OAuth 2.0 認可 (Authorization) に基づいています。複数のアプリケーション間でのフェデレーテッドアイデンティティ管理をサポートしており、一般的にシングルサインオン (SSO) と呼ばれます。

あなたの Traditional web アプリケーションを作成するには、次の手順に従ってください：

Logto コンソールを開きます。「Get started」セクションで「View all」リンクをクリックしてアプリケーションフレームワークのリストを開きます。あるいは、Logto Console > Applications に移動し、「Create application」ボタンをクリックします。
開いたモーダルで、左側のクイックフィルターチェックボックスを使用して、すべての利用可能な "Traditional web" フレームワークをフィルタリングするか、"Traditional web" セクションをクリックします。".Net Core (Blazor Server)" フレームワークカードをクリックして、アプリケーションの作成を開始します。
アプリケーション名を入力します。例：「Bookstore」と入力し、「Create application」をクリックします。

🎉 タダーン！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 認証 (Authentication) サービスを登録します：

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 メソッドは次のことを行います：

デフォルトの認証 (Authentication) スキームを LogtoDefaults.CookieScheme に設定します。
デフォルトのチャレンジスキームを LogtoDefaults.AuthenticationScheme に設定します。
デフォルトのサインアウトスキームを LogtoDefaults.AuthenticationScheme に設定します。
認証 (Authentication) スキームにクッキーと OpenID Connect 認証 (Authentication) ハンドラーを追加します。

進む前に、.NET Core 認証 (Authentication) ミドルウェアにおける混乱しやすい用語を 2 つ明確にする必要があります：

CallbackPath: ユーザーがサインインした後に Logto がユーザーをリダイレクトする URI（Logto における「リダイレクト URI」）
RedirectUri: Logto 認証 (Authentication) ミドルウェアで必要なアクションが実行された後にリダイレクトされる URI。

サインインプロセスは次のように示されます：

同様に、.NET Core にはサインアウトフローのための SignedOutCallbackPath と RedirectUri もあります。

明確にするために、これらを次のように呼びます：

使用する用語	.NET Core 用語
Logto リダイレクト URI	CallbackPath
Logto サインアウト後リダイレクト URI	SignedOutCallbackPath
アプリケーションリダイレクト URI	RedirectUri

この認証 (Authentication) プロセスは OpenID Connect (OIDC) プロトコルに従い、Logto はユーザーのサインインを保護するために厳格なセキュリティ対策を講じています。
複数のアプリがある場合、同じアイデンティティプロバイダー (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 コンポーネントから呼び出された場合、期待通りに動作しません。

これを正しく行うためには、サインインとサインアウトのリダイレクト用に 2 つのエンドポイントを明示的に追加する必要があります：

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>認証 (Authentication) 済み: @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 は、現在のユーザーの認証 (Authentication) 状態を取得し、User プロパティを設定するために使用されます。
SignIn と SignOut メソッドは、それぞれサインインおよびサインアウトのエンドポイントにユーザーをリダイレクトするために使用されます。Blazor Server の性質上、リダイレクションをトリガーするために NavigationManager を強制ロードで使用する必要があります。

ページは、ユーザーが認証 (Authentication) されていない場合は「サインイン」ボタンを表示し、認証 (Authentication) されている場合は「サインアウト」ボタンを表示します。

`<AuthorizeView />` コンポーネント

代わりに、AuthorizeView コンポーネントを使用して、ユーザーの認証 (Authentication) 状態に基づいてコンテンツを条件付きでレンダリングすることができます。このコンポーネントは、認証 (Authentication) 済みユーザーと未認証ユーザーに異なるコンテンツを表示したい場合に便利です。

Razor コンポーネントに次のコードを追加します：

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

@* ... *@

<AuthorizeView>
    <Authorized>
        <p>Name: @User?.Identity?.Name</p>
        @* 認証 (Authentication) 済みユーザー向けのコンテンツ *@
    </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 SAML 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: Azure AD SSO アプリケーションを作成する

Azure AD SSO 統合を開始するには、Azure AD 側で SSO アプリケーションを作成します。

Azure ポータルにアクセスし、管理者としてサインインします。
Microsoft Entra ID サービスを選択します。
サイドメニューを使用して Enterprise applications に移動します。New application をクリックし、Create your own application を選択します。

Azure AD create application.webp

アプリケーション名を入力し、Integrate any other application you don't find in the gallery (Non-gallery) を選択します。
Setup single sign-on > SAML を選択します。

Azure AD set up SSO.webp

指示に従い、最初のステップとして、Logto によって提供される以下の情報を使用して基本的な SAML 構成を入力する必要があります。

Azure AD SP config

Audience URI(SP Entity ID): これは、Logto サービスのグローバルに一意の識別子として機能し、IdP への認証リクエスト中に SP の EntityId として機能します。この識別子は、IdP と Logto 間で SAML アサーションやその他の認証関連データを安全に交換するために重要です。
ACS URL: アサーションコンシューマーサービス (ACS) URL は、POST リクエストで SAML アサーションが送信される場所です。この URL は、IdP が SAML アサーションを Logto に送信するために使用されます。これは、ユーザーのアイデンティティ情報を含む SAML 応答を受信し消費することを Logto が期待するコールバック URL として機能します。

Save をクリックして続行します。

ステップ 2: Logto で SAML SSO を設定する

SAML SSO 統合を機能させるには、IdP メタデータを Logto に戻す必要があります。Logto 側に戻り、Azure AD SSO コネクターの Connection タブに移動しましょう。

Logto は、IdP メタデータを構成するための 3 つの異なる方法を提供しています。最も簡単な方法は、Azure AD SSO アプリケーションの metadata URL を提供することです。

Azure AD SSO アプリケーションの SAML Certificates セクション から App Federation Metadata Url をコピーし、それを Logto の Metadata URL フィールドに貼り付けます。

Azure AD Metadata URL.webp

Logto は URL からメタデータを取得し、SAML SSO 統合を自動的に構成します。

ステップ 3: ユーザー属性のマッピングを設定する

Logto は、IdP から返されるユーザー属性を Logto のユーザー属性にマッピングする柔軟な方法を提供します。Logto はデフォルトで次のユーザー属性を IdP から同期します：

id: ユーザーの一意の識別子。Logto は SAML レスポンスから nameID クレームを読み取り、ユーザーの SSO アイデンティティ ID として使用します。
email: ユーザーのメールアドレス。Logto はデフォルトで SAML レスポンスから email クレームを読み取り、ユーザーのプライマリメールとして使用します。
name: ユーザーの名前。

ユーザー属性のマッピングロジックは、Azure AD 側または Logto 側のいずれかで管理できます。

AzureAD ユーザー属性を Logto ユーザー属性に Logto 側でマッピングする。

Azure AD SSO アプリケーションの Attributes & Claims セクションにアクセスします。

次の属性名（名前空間プレフィックス付き）をコピーし、Logto の対応するフィールドに貼り付けます。
- http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress
- http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name （推奨：この属性値マップを user.displayname に更新して、より良いユーザー体験を提供する）

Azure AD default attribute mapping.webp

AzureAD ユーザー属性を AzureAD 側で Logto ユーザー属性にマッピングする。

Azure AD SSO アプリケーションの Attributes & Claims セクションにアクセスします。

Edit をクリックし、Logto ユーザー属性設定に基づいて Additional claims フィールドを更新します：
- Logto ユーザー属性設定に基づいてクレーム名の値を更新します。
- 名前空間プレフィックスを削除します。
- Save をクリックして続行します。
次の設定で終了する必要があります：

Azure AD_Logto attribute mapping.webp

Azure AD 側で追加のユーザー属性を指定することもできます。Logto は、ユーザーの sso_identity フィールドの下に IdP から返された元のユーザー属性の記録を保持します。

ステップ 4: Azure AD SSO アプリケーションにユーザーを割り当てる

Azure AD SSO アプリケーションの Users and groups セクションにアクセスします。Add user/group をクリックして、ユーザーを Azure AD SSO アプリケーションに割り当てます。Azure AD SSO アプリケーションに割り当てられたユーザーのみが、Azure AD SSO コネクターを通じて認証 (Authentication) することができます。

Azure AD assign users.webp

ステップ 5: メールドメインを設定し、SSO コネクターを有効にする

Logto のコネクター SSO 体験 タブで、あなたの組織の メールドメイン を提供してください。これにより、これらのユーザーに対する認証 (Authentication) 方法として SSO コネクターが有効になります。

指定されたドメインのメールアドレスを持つユーザーは、唯一の認証 (Authentication) 方法として SAML SSO コネクターを使用するようにリダイレクトされます。

Azure AD SSO 統合の詳細については、Azure AD の公式ドキュメントを確認してください。

Save your configuration

Logto コネクター設定エリアで必要な値をすべて記入したことを確認してください。「保存して完了」または「変更を保存」をクリックすると、Microsoft Entra ID SAML 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 SAML enterprise SSO を使用してサインインできるはずです。お楽しみください！

Create an application in Logto​

Integrate .Net Core (Blazor Server) SDK​

インストール​

Logto 認証 (Authentication) を追加する​

サインインおよびサインアウトフロー​

リダイレクトベースのサインインについて​

リダイレクト URI を設定する​

デフォルトパスを変更する​

ルートを追加する​

サインイン / サインアウトボタンを実装する​

<AuthorizeView /> コンポーネント​

チェックポイント: アプリケーションをテストする​

Add Microsoft Entra ID SAML enterprise SSO connector​

Set up Azure AD SSO アプリケーション​

ステップ 1: Azure AD SSO アプリケーションを作成する​

ステップ 2: Logto で SAML SSO を設定する​

ステップ 3: ユーザー属性のマッピングを設定する​

ステップ 4: Azure AD SSO アプリケーションにユーザーを割り当てる​

ステップ 5: メールドメインを設定し、SSO コネクターを有効にする​

Save your configuration​

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

Testing and Validation​

Further readings​