Azure AD B2C を使ったApp Serviceのサインイン開発備忘録

投稿者: | 2022年11月21日

ほとんど公式サイトの解説とサンプルコードを読むだけで開発できたけど、必要な情報へアクセスするまでのリンクと詰まったところをメモ

https://learn.microsoft.com/ja-jp/azure/active-directory-b2c/enable-authentication-web-application?tabs=visual-studio

Azure AD B2Cの作成

Azure AD B2C を使ってサンプル web アプリケーションで認証を構成する

まずアプリの登録からApp Serviceがアクセスできる入口を作成します。

サーバーサイドのコード作成

Azure AD B2C を使用して独自の Web アプリで認証を有効にする

デプロイする予定のコードをサンプルコードを参考にしながら改変する。

IDプロバイダーの作成

Azure AD ログインを使用するように App Service または Azure Functions アプリを構成する

デプロイしたApp Serviceの認証設定からIDプロバイダーを作成する。GoolgleやらMicorosftやら色々な認証がありますが、Azure AD B2Cの認証はOpenIDなのでこれを作成。

メタデータの設定

Azure AD ログインを使用するように App Service または Azure Functions アプリを構成する

IDプロバイダーに設定するメタデータへのURLは下記の値となります。

https://<B2Cのドメイン>.b2clogin.com/<B2Cのドメイン>.onmicrosoft.com/<アプリ登録で作成したユーザーフロー名>/v2.0/.well-known/openid-configuration

リダイレクトURLの作成

OpenID Connect プロバイダーを使用してログインするように App Service または Azure Functions アプリを構成する

app-urlとはApp Serviceのurlでprovider-nameとはさきほど作成したIDプロバイダーの名前です。

アプリ登録のリダイレクトURLの値は<app-url>/.auth/login/<provider-name>/callbackを設定します。
メモ
OAuth2は/.auth/login/<provider-name>/callback
OpenIdは/signin-oidc
らしいけどOpenIdはOAuth2に組み込まれているので同じはず??

まとめ

上記の作成のながれをまとめたのが下記のリンクなのでこちらも参考になります。

Azure AD B2C を使って Azure Web アプリで認証を構成する

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)