Okta CIC(Auth0)とAzure AppServiceでパスワードレス認証を爆速で実装する

TL;DR

• 2023.4.4にOkta CICのパスワードレス認証（New Universal Login）がGAしました
• ということで、New Universal Loginのパスワードレス認証を試してみます
• Azure AppServiceのEasyAuthを利用して、爆速でOkta CICとの連携を実現します

WebAppsの作成

まず、認証を要求しないパブリックなWebアプリを作成します。

1. Azureポータルにログインし、AppServiceから作成を選択
2. 各設定を行って作成
   
3. デプロイが完了したら、URLにアクセスして画面が表示されることを確認
   
   これで、テスト用のアプリが作成できました。

Auth0の準備

公式ドキュメントに従って、Okta CICを設定します。

1. Okta CICダッシュボードにアクセス
2. Authentication > Authentication Profile > Identifier Firstを選択
3. Applications > Applications > Create Applicationを選択してアプリを作成
   • Name: 任意の名前
   • Choose an application type:Regualar Web Applications
4. 作成したアプリの設定画面が開くので、Connectionsタブを選択
   • Passwordlessのemail: ON
   • それ以外のすべて: OFF
5. Settingsタブから以下を設定
   • Allowed Callback URLs: {AppServiceのURL}/.auth/login/oktacic/callback

認証（EasyAuth）設定

AppServiceがAuth0で認証できるように設定を行います。

1. AppServiceの設定 > 認証 IDプロバイダーを追加を選択
2. 以下の通り設定して、追加を選択
   • IDプロバイダー: OpenID Connect
   • OpenIDプロバイダー名: oktacic(callback URLのpathと一致させる)
   • メタデータエントリ: ドキュメントのURL
   • メタデータURL: https://{yourDomain}/.well-known/openid-configuration
   • クライアントID: Auth0で作成したアプリのSettingsタブの値
   • クライアントシークレット: Auth0で作成したアプリのSettingsタブの値
   • アクセスを制限する: 認証が必要
   • 認証されていない要求: HTTP302リダイレクトが見つかりました
     

パスワードレス認証を試す

では試していきましょう。

1. AppServiceのURLにアクセスすると、認証のためAuth0の画面へリダイレクトされます
   
2. メールアドレスを入力すると、コードの入力画面が表示されます
   
3. メールを確認して、コードを入力します
   
   
4. 認証が完了し、AppServiceの画面が表示されました
   

まとめ

Azure AppServiceのEasyAuthとOkta CICを連携させることで、アプリケーションに影響を与えることなく、パスワードレス認証を実装することができました。標準仕様って素晴らしいですね。

世の中はPasskeyブームですが、現時点での導入しやすさを考えると、セキュアかつUI/UXもシンプルなパスワードレス認証は、選択肢の一つになるのではないでしょうか。