第111回 雲勉【オンライン】Azure AD と Static Web Apps でWebサイトに認証機能を導入する

Transcript

1. 第111回 雲勉【オンライン】
   Azure AD と Static Web Apps で
   Web サイトに認証機能を導入する
   平田 健士郎
   

   View Slide

2. アジェンダ
   ● ⾃⼰紹介
   ● 注意点
   ● 話すこと/話さないこと
   ● Azure AD と Static Web Apps で Web サイトに認証を導⼊するケース
   ● デモ
   ● デモ環境の作成⽅法ご説明
   ● まとめ
   

   View Slide

3. ⾃⼰紹介
   

   View Slide

4. ⾃⼰紹介
   平⽥ 健⼠郎 (ひらた けんじろう)
   ■ クラウドインテグレーション事業部 構築第⼋セクション
   ■ 業務内容はクラウドインフラの設計/構築/運⽤
   ■ アイレット⼊社約1年半
   ■ 前職で MSP を 2 年を経験してそこで初めてクラウドに触れる
   ■ 業務では AWS 中⼼だが Azure 案件の経験もあり
   ←奥さんに描いてもらった似顔絵
   

   View Slide

5. 注意点
   

   View Slide

6. 注意点①
   Azure AD (Azure Active Directory) は Microsoft Entra ID に
   名称が変更される予定ですが、この登壇時点ではまだ名称変更されて
   いないため、この登壇では「Azure AD」と名称を統⼀します。
   https://www.microsoft.com/ja-jp/security/business/identity-access/azure-active-directory
   

   View Slide

7. 注意点②
   当資料内の動画、画像で実際の Azure のリソースが表⽰されます
   が、動画公開時は全て削除しております。
   ご了承ください。
   

   View Slide

8. 話すこと/話さないこと
   

   View Slide

9. 話すこと
   ●Static Web Apps と Azure AD の簡単な説明
   ●Static Web Apps での静的 Web サイトの作成⽅法
   ●Azure AD の認証を Static Web Apps に組み込む⽅法
   ●特定の Azure AD テナントのみ認証を許可する⽅法
   話さないこと
   ●Azure の基礎的な操作⽅法
   ●OpenID Connect 等の認証プロトコルの深掘りした話
   

   View Slide

10. Azure AD と Static Web Apps で
    Web サイトに認証を導⼊するケース
    

    View Slide

11. こんなケースがあったとします
    社内向けに簡単な Web サイトを作るん
    だけど、
    社内のユーザーだけが認証されるよう
    にして外部から見えないようにしたい
    なー
    

    View Slide

12. こんなケースがあったとします
    Web サイトを稼働させている
    サーバー内で専用の認証機能を導入し
    てユーザーを作る？
    [面倒くさい]
    Web サイト専用にユーザーを作成すること
    になるため管理が増えて煩雑化
    👎
    

    View Slide

13. こんなケースがあったとします
    社内で利用している Azure AD の認証
    を使い回す形で Web サイトに組み込
    めたら楽なのでは！？
    [楽！]
    既存の Azure AD で SSO ができるのでユー
    ザー管理の手間が増えないため楽
    👍
    

    View Slide

14. Static Web Apps で作成した
    静的 Web サイトに
    AzureAD で認証を導入します！
    

    View Slide

15. Static Web Apps とは
    静的 Web サイトのホスティングサービス
    ● 手軽に 静的 Web サイトを作成できる (無料プランもある)
    ● サーバーレス
    ● GitHub Actions 等の CI/CD ワークフロー
    

    View Slide

16. Azure AD とは
    クラウドベースの ID およびアクセス管理サービス
    クラウドサービスやオンプレミスに認証・認可を提供
    認証 : 身元を確認すること
    認可 : 権限を与えること
    シングルサインオン (SSO) や多要素認証の導入などができる
    

    View Slide

17. デモ
    

    View Slide

18. イメージ
    

    View Slide

19. イメージ
    Static Web Apps の URL に対して
    ブラウザからアクセスする
    

    View Slide

20. イメージ
    認証が要求されるため
    サインインする
    

    View Slide

21. イメージ
    サインインできれば Static Web
    Apps
    のコンテンツが表示される
    

    View Slide

22. 実際の様子を動画でお見せします！
    

    View Slide

23. 動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

24. こんな感じです！
    

    View Slide

25. さらに発展した使い方の
    例を紹介します
    

    View Slide

26. 発展系の例 (今回はこれは作りません)
    (例)
    今話題の ChatGPT を
    Azure 内で利用できる
    「Azure OpenAI Service」を
    利用するサービスを社内の人
    のみに公開する
    

    View Slide

27. 発展系の例 (今回はこれは作りません)
    (例)
    今話題の ChatGPT を
    Azure 内で利用できる
    「Azure OpenAI Service」を
    利用するサービスを社内の人
    のみに公開する
    

    View Slide

28. というわけで
    先ほど動画でお見せした
    環境の作り方をご説明します
    

    View Slide

29. デモ環境の作成⽅法ご説明
    

    View Slide

30. 説明する環境の構成図
    

    View Slide

31. ソースコードの作成
    clphirata-kumoben-azuread-staticapp/
    ├ index.html
    ├ README.md
    └ styles.css
    

    View Slide

32. ソースコードの作成
    clphirata-kumoben-azuread-staticapp/
    ├ index.html
    ├ README.md
    └ styles.css
    

    View Slide

33. ソースコードの作成
    clphirata-kumoben-azuread-staticapp/
    ├ index.html
    ├ README.md
    └ styles.css
    

    View Slide

34. ソースコードの作成
    clphirata-kumoben-azuread-staticapp/
    ├ index.html
    ├ README.md
    └ styles.css
    

    View Slide

35. GitHub リポジトリ作成
    リポジトリ名 :
    clphirata-kumoben-azuread-staticapp
    

    View Slide

36. GitHub リポジトリにコードを push
    clphirata-kumoben-azuread-staticapp/
    ├ index.html
    ├ README.md
    └ styles.css
    

    View Slide

37. Static Web Apps の作成
    ● Static Web Apps 名に「clphirata-kumoben-staticapp」を指定
    ● Standard プランを選択 (後で説明)
    ● ソースとなる GitHub リポジトリを指定
    ● Static Web Apps 作成
    

    View Slide

38. Static Web Apps の作成
    ● Static Web Apps 名に「clphirata-kumoben-staticapp」を指定
    ● Standard プランを選択 (後で説明)
    ● ソースとなる GitHub リポジトリを指定
    ● Static Web Apps 作成
    自動デプロイされてコンテンツが表示できるようになる
    ● Static Web Apps を作成したら GitHub リポジトリからソースを取得してデプロイ
    ● コンテンツ表示を確認
    

    View Slide

39. Static Web Apps の作成
    ● Static Web Apps 名に「clphirata-kumoben-staticapp」を指定
    ● Standard プランを選択 (後で説明)
    ● ソースとなる GitHub リポジトリを指定
    ● Static Web Apps 作成
    動画で様子をお見せします！
    自動デプロイされてコンテンツが表示できるようになる
    ● Static Web Apps を作成したら GitHub リポジトリからソースを取得してデプロイ
    ● コンテンツ表示を確認
    

    View Slide

40. Static Web Apps の作成
    動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

41. GitHub Actions による 自動デプロイ
    Static Web Apps を作成して
    ソースに GitHub リポジトリを指定
    することで GitHub Actions という
    機能を使って 自動デプロイ を実現
    できる
    

    View Slide

42. GitHub Actions による 自動デプロイ
    同時に GitHub のソースコードに
    GitHub Actions 設定用の
    yuml ファイルが作成される
    

    View Slide

43. GitHub Actions による 自動デプロイ
    同時に GitHub のソースコードに
    GitHub Actions 設定用の
    yuml ファイルが作成される
    中身はこんな感じ →
    (今回はこの部分はメインではない
    ため詳細は割愛します)
    

    View Slide

44. GitHub Actions による 自動デプロイ
    GitHub のソースコードに
    GitHub Actions 設定用の
    yuml ファイルが作成されたので、
    ローカルをリモートに合わせるため
    git pull を行います。
    

    View Slide

45. ここまで作れました
    

    View Slide

46. ここから Web サイトの認証に
    既存の Azure AD テナントを使うため
    の設定を行います。
    

    View Slide

47. ここから Web サイトの認証に
    既存の Azure AD テナントを使うため
    の設定を行います。
    が、その前に
    

    View Slide

48. Static Web Apps では
    既存の認証プロバイダーを使うための
    機能が
    デフォルトで備わっています
    

    View Slide

49. Static Web Apps で既存の認証を使う機
    能
    Static Web Apps には作成段階で何もしなくても
    デフォルトで既存の認証プロバイダーを使う機能が備わってい
    ます。
    

    View Slide

50. 作成時点で 3 つの認証プロバイダーが設定されています
    認証プロバイダー
    Azure AD
    GitHub
    Twitter
    Static Web Apps で既存の認証を使う機
    能
    

    View Slide

51. それぞれ専用のログイン URL が用意されています
    認証プロバイダー ログイン URL
    Azure AD https://**********.azurestaticapps.net/.auth/login/aad
    GitHub https://**********.azurestaticapps.net/.auth/login/github
    Twitter https://**********.azurestaticapps.net/.auth/login/twitter
    動画で様子をお見せします！
    Static Web Apps で既存の認証を使う機
    能
    

    View Slide

52. Static Web Apps で既存の認証を使う機
    能
    動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

53. え、じゃあこれで
    やりたいことは実現できたの？
    

    View Slide

54. 実はそうではありません
    

    View Slide

55. Static Web Apps の認証機能
    ↓ 先ほどの動画でサインインしたアカウント
    

    View Slide

56. Static Web Apps の認証機能
    ←この Azure アカウントの
    Azure AD テナントのユーザーではない
    ↓ 先ほどの動画でサインインしたアカウント
    

    View Slide

57. Static Web Apps の認証機能
    Static Web Apps の
    デフォルトの認証機能だけでは
    この世のどこかの Azure AD のユーザー
    であれば誰でも認証できてしまう状態
    

    View Slide

58. 最初にお見せした要望の話
    社内向けに簡単な Web サイトを作るん
    だけど、
    社内のユーザーだけが認証されるよう
    にして外部から見えないようにしたい
    なー
    

    View Slide

59. 社内向けに簡単な Web サイトを作るん
    だけど、
    社内のユーザーだけが認証されるよう
    にして外部から見えないようにしたい
    なー
    最初にお見せした要望の話
    特定の Azure AD テナントのみ
    認証を許可したい
    

    View Slide

60. ここからは
    特定の Azure AD テナントのみ
    認証を許可するための設定をします
    

    View Slide

61. Azure AD でアプリの登録 (新規登録)
    「アプリの登録」
    Azure AD と他のリソースを連携するための設定箇所
    ここで特定の Azure AD テナントに
    今回作成した Static Web Apps を登録することで
    特定の Azure AD テナントのみ認証を許可する設定をします。
    

    View Slide

62. Azure AD でアプリの登録 (新規登録)
    

    View Slide

63. Azure AD でアプリの登録 (新規登録)
    指定した Azure AD テナントで
    Static Web Apps が認証できるように登録する
    

    View Slide

64. Azure AD でアプリの登録 (新規登録)
    指定した Azure AD テナントで
    Static Web Apps が認証できるように登録する
    動画で様子をお見せします！
    

    View Slide

65. Azure AD でアプリの登録 (新規登録)
    動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

66. Azure AD でアプリの登録 (認証)
    「アプリの登録」で登録したアプリにて 認証 の設定を行います。
    ここで設定する項目は以下です
    ・リダイレクト URI
    ・ログアウト URL
    ・承認エンドポイントによって発行してほしいトークン->ID トークン
    

    View Slide

67. Azure AD でアプリの登録 (認証)
    「アプリの登録」で登録したアプリにて認証の設定を行います。
    ここで設定する項目は以下です。
    ・リダイレクト URI
    ・ログアウト URL
    ・承認エンドポイントによって発行してほしいトークン->ID トークン
    これらについて説明します
    

    View Slide

68. ・リダイレクト URI
    ・ログアウト URL
    ・承認エンドポイントによって発行してほしいトークン->ID トークン
    これらは OpenID Connect という
    認証プロトコルで使われる要素です
    

    View Slide

69. ・リダイレクト URI
    ・ログアウト URL
    ・承認エンドポイントによって発行してほしいトークン->ID トークン
    これらは OpenID Connect という
    認証プロトコルで使われる要素です
    Static Web Apps で特定の Azure AD テナントでの認証を許可
    するには「カスタム認証」という設定が必要なのですが、
    このカスタム認証で OpenID Connect という認証プロトコルに
    関する設定箇所があります。
    

    View Slide

70. OpenID Connect の認証
    https://learn.microsoft.com/ja-jp/azure/active-directory/architecture/auth-oidc
    Azure Active Directory を使用した OpenID Connect 認証
    

    View Slide

71. ・リダイレクト URI
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/reply-url
    リダイレクト URI、すなわち応答 URL は、アプリが正しく承認され、
    認証コードまたはアクセス トークンが付与されると、承認サーバーが
    ユーザーを送り出す場所です。 承認サーバーは、リダイレクト URI に
    このコードまたはトークンを送信するため、アプリ登録プロセスの一環
    として正しい場所を登録することが重要です。
    

    View Slide

72. ・リダイレクト URI
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/reply-url
    リダイレクト URI、すなわち応答 URL は、アプリが正しく承認され、
    認証コードまたはアクセス トークンが付与されると、承認サーバーが
    ユーザーを送り出す場所です。 承認サーバーは、リダイレクト URI に
    このコードまたはトークンを送信するため、アプリ登録プロセスの一環
    として正しい場所を登録することが重要です。
    

    View Slide

73. ・リダイレクト URI
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/reply-url
    リダイレクト URI、すなわち応答 URL は、アプリが正しく承認され、
    認証コードまたはアクセス トークンが付与されると、承認サーバーが
    ユーザーを送り出す場所です。 承認サーバーは、リダイレクト URI に
    このコードまたはトークンを送信するため、アプリ登録プロセスの一環
    として正しい場所を登録することが重要です。
    

    View Slide

74. ・ログアウト URL
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/scenario-web-app-sign-user-
    sign-in?tabs=aspnetcore#sign-out
    サインアウトするには、Web アプリによってユーザーが Microsoft ID
    プラットフォーム logout エンドポイントにリダイレクトされる必要も
    あります。
    Web アプリによってユーザーが logout エンドポイントにリダイレクト
    されると、このエンドポイントでは、ユーザーのセッションがブラウザ
    ーから消去されます。
    

    View Slide

75. ・リダイレクト URI
    ・ログアウト URL
    Static Web Apps では上記がデフォルトで用意されています
    ※ Azure AD の場合
    リダイレクト URI https://***********.azurestaticapps.net/.auth/login/aad/callback
    ログアウト URL https://***********.azurestaticapps.net/.auth/logout/aad/callback
    

    View Slide

76. ・承認エンドポイントによって発行してほしいトークン->ID トークン
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/id-tokens
    ID トークンは承認サーバーによって発行され、ユーザーについての情報
    を伝えるクレームを含んでいます。 これらは、アクセス トークンの代
    わりに、またはアクセス トークンと共に送信できます。 ID トークンに
    含まれる情報により、ユーザーが主張するとおりの人物であることをク
    ライアントで確認できます。
    

    View Slide

77. ・承認エンドポイントによって発行してほしいトークン->ID トークン
    https://learn.microsoft.com/ja-jp/azure/active-directory/develop/id-tokens
    ID トークンは承認サーバーによって発行され、ユーザーについての情報
    を伝えるクレームを含んでいます。 これらは、アクセス トークンの代
    わりに、またはアクセス トークンと共に送信できます。 ID トークンに
    含まれる情報により、ユーザーが主張するとおりの人物であることをク
    ライアントで確認できます。
    ID トークンが必要だから
    発行してね、
    という設定が必要
    

    View Slide

78. Azure AD でアプリの登録 (認証)
    というわけで以下の設定が必要です
    ・リダイレクト URI
    ・ログアウト URL
    ・承認エンドポイントによって発行してほしいトークン->ID トークン
    動画で様子をお見せします！
    

    View Slide

79. Azure AD でアプリの登録 (認証)
    動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

80. Azure AD でアプリの登録 (シークレッ
    ト)
    アプリ (本件では Static Web Apps) が Azure AD と接続するための資格情報とし
    てクライアントシークレットを発行します。
    ①
    ②
    

    View Slide

81. Azure AD でアプリの登録 (シークレッ
    ト)
    アプリ (本件では Static Web Apps) が Azure AD と接続するための資格情報とし
    てクライアントシークレットを発行します。
    

    View Slide

82. Azure AD でアプリの登録 (シークレッ
    ト)
    アプリ (本件では Static Web Apps) が Azure AD と接続するための資格情報とし
    てクライアントシークレットを発行します。
    

    View Slide

83. Azure AD でアプリの登録 (その他の情
    報)
    Static Web Apps に設定が必要な以下の値を取得します。
    ・アプリケーション (クライアント) ID
    ・ディレクトリ (テナント) ID
    ①
    

    View Slide

84. Azure AD 側の設定は済んだため
    Static Web Apps の設定に戻ります！
    

    View Slide

85. Static Web Apps で変数の保存
    Static Web Apps でクライアントID と シークレットの値を変数として保存をしま
    す
    値は暗号化して保存されます
    https://learn.microsoft.com/ja-jp/azure/static-web-apps/application-settings
    

    View Slide

86. Static Web Apps で変数の保存
    設定箇所
    

    View Slide

87. Static Web Apps で変数の保存
    クライアント ID 変数設定
    

    View Slide

88. Static Web Apps で変数の保存
    シークレット値 変数設定
    

    View Slide

89. Static Web Apps で変数の保存
    Save で保存
    

    View Slide

90. Static Web Apps のアプリ構成ファイルを作成
    Static Web Apps のアプリ構成ファイル
    staticwebapp.config.json
    https://learn.microsoft.com/ja-jp/azure/static-web-apps/configuration
    

    View Slide

91. Static Web Apps のアプリ構成ファイルを作成
    Static Web Apps のアプリ構成ファイル
    staticwebapp.config.json
    https://learn.microsoft.com/ja-jp/azure/static-web-apps/configuration
    今回使う構成ファイルを元に
    必要な箇所だけご説明します
    

    View Slide

92. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    認証系の設定
    

    View Slide

93. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    認証系の設定
    ID プロバイダーとして AzureAD を指定
    

    View Slide

94. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    認証系の設定
    ID プロバイダーとして AzureAD を指定
    認証の設定
    openIdIssuer : OpenID Connect 発行者 URI
    

    View Slide

95. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    認証系の設定
    ID プロバイダーとして AzureAD を指定
    認証の設定
    clientIdSettingName : 認証情報
    clientSecretSettingName : 認証情報
    

    View Slide

96. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    ルーティングの設定
    /* に対して適用する
    authenticated (認証済み) の場合のみ allowedRoles (ルートへのアク
    セスを許可する
    

    View Slide

97. Static Web Apps のアプリ構成ファイルを作成
    {
    "auth": {
    "identityProviders": {
    "azureActiveDirectory": {
    "registration": {
    "openIdIssuer": "https://login.microsoftonline.com/[テナント ID]/v2.0",
    "clientIdSettingName": "AZURE_CLIENT_ID",
    "clientSecretSettingName": "AZURE_CLIENT_SECRET"
    }
    }
    }
    },
    "routes": [
    {
    "route": "/*",
    "allowedRoles": [
    "authenticated"
    ]
    }
    ],
    "responseOverrides": {
    "401": {
    "statusCode": 302,
    "redirect": "/.auth/login/aad"
    }
    }
    }
    サーバーからエラー コードが返される場合のカスタム応答を設定
    401：Unauthorized コードの時に
    302 : Temporary Redirect コードにオーバーライドして
    "/.auth/login/aad" にリダイレクトする
    

    View Slide

98. Static Web Apps のアプリ構成ファイルを作成
    作成した構成ファイルを GitHub に push したら
    GitHub Actions により Static Web Apps にデプロイされることにより
    意図した設定 (特定の Azure AD のみ認証可能な状態) が反映されます
    動画で様子をお見せします！(これが最後)
    

    View Slide

99. 動画については YouTube をご覧ください
    上記の QR コードで登壇動画の該当の時間にジャンプできます
    

    View Slide

100. 説明した環境の構成図
     この構成の作り方についてご説明させていただきました
     

     View Slide

101. まとめ
     

     View Slide

102. まとめ
     ● AzureAD でアプリケーションへの認証と認可を提供できます
     

     View Slide

103. まとめ
     ● AzureAD でアプリケーションへの認証と認可を提供できます
     ● Static Web Apps は既存の認証を利用する機能がデフォルトで
     が実装されています
     

     View Slide

104. まとめ
     ● AzureAD でアプリケーションへの認証と認可を提供できます
     ● Static Web Apps は既存の認証を利用する機能がデフォルトで
     が実装されています
     ● 特定の AzureAD テナントで認証を許可する設定が可能です
     

     View Slide

105. まとめ
     ● AzureAD でアプリケーションへの認証と認可を提供できます
     ● Static Web Apps は既存の認証を利用する機能がデフォルトで
     が実装されています
     ● 特定の AzureAD テナントで認証を許可する設定が可能です
     ● これらによって簡単に社内向け Web サイトを作成して認証を組
     み込むことが可能です
     

     View Slide

106. ご清聴ありがとうございました
     

     View Slide