Azure Static Web Apps の認証と認可

2023-10-24

Azure Static Web Apps は、認証に GitHub と Microsoft Entra ID を使用するための追加の構成を必要としない、合理化された認証エクスペリエンスを提供します。この記事に記載されているすべての機能は、すべての静的 Web アプリプランで使用できます。

この記事では、既定の動作、サインインとサインアウトを設定する方法、認証プロバイダーをブロックする方法などについて説明します。特定の使用に関する認証の詳細を確認するには、「ユーザー情報にアクセスする」を参照してください。

すべての事前構成済みプロバイダーを無効にするカスタムプロバイダーを登録できます。

警告

X (旧 Twitter) API ポリシーの変更により、アプリの事前構成済みプロバイダーの一部としてサポートを利用できなくなりました。アプリでの認証/承認に引き続き X (以前の Twitter) を使用する場合は、カスタムプロバイダーを登録するためアプリ構成を更新します。

前提条件

Azure Static Web Apps を使用した認証と認可については、次の既定値とリソースに注意してください。

既定値:

すべてのユーザーが、事前構成されたプロバイダーで認証できます
- GitHub
- Microsoft Entra ID
- 認証プロバイダーを制限するには、カスタムルート規則によってアクセスをブロックします
サインイン後、ユーザーは anonymous ロールと authenticated ロールに属します。ロールの詳細については、「ロールの管理」を参照してください

リソース:

staticwebapp.config.json ファイルでルールを定義して、許可されているユーザーが制限されたルートにアクセスできるようにします
組み込みの招待システムを使用してユーザーのカスタム役割を割り当てる
API 関数を使用してサインイン時にユーザーにカスタム役割をプログラムで割り当てる
認証と認可は、ルーティングの概念とはかなり重複していることを理解します。ルーティングの概念については、アプリケーション構成ガイドに詳しく説明されています
カスタム Microsoft Entra ID プロバイダーを構成して、特定の Microsoft Entra ID テナントへのサインインを制限します。事前構成済みの Microsoft Entra ID プロバイダーを使用すると、任意の Microsoft アカウントでサインインできます。

サインインを設定する

Azure Static Web Apps では、/.auth システムフォルダーを使用して、承認関連の API へのアクセスが提供されています。 /.auth フォルダーの下のルートをエンドユーザーに直接公開するのではなく、わかりやすい URL のルーティング規則を作成します。

次の表を使用して、プロバイダー固有のルートを確認します。

承認プロバイダー	サインインルート
Microsoft Entra ID	`/.auth/login/aad`
GitHub	`/.auth/login/github`

たとえば、GitHub でサインインするには、次の例のような URL を使用できます。

<a href="/.auth/login/github">Login</a>

複数のプロバイダーをサポートすることを選んだ場合は、Web サイト上のプロバイダーごとにプロバイダー固有のリンクを使用します。ルート規則を使用して、既定のプロバイダーを /login のようなわかりやすいルートにマップします。

{
  "route": "/login",
  "redirect": "/.auth/login/github"
}

post_login_redirect_uri クエリ文字列パラメーターに完全修飾 URL を指定することで、サインイン後にユーザーを特定のページに戻すことができます。

<a href="/.auth/login/github?post_login_redirect_uri=https://zealous-water.azurestaticapps.net/success">Login</a>

You can also redirect unauthenticated users back to the referring page after they sign in. To add this redirect, create a response override rule that sets post_login_redirect_uri to .referrer, like in the following example.

{
  "responseOverrides": {
    "401": {
      "redirect": "/.auth/login/github?post_login_redirect_uri=.referrer",
      "statusCode": 302
    }
  }
}

サインアウトの設定

/.auth/logout ルートでは、Web サイトからユーザーをサインアウトします。次の例に示すように、サイトナビゲーションにユーザーがサインアウトできるリンクを追加することが可能です。

<a href="/.auth/logout">Log out</a>

ルート規則を使用して、/login のようなわかりやすいルートにマップします。

{
  "route": "/logout",
  "redirect": "/.auth/logout"
}

サインアウト後のリダイレクトを設定する

サインアウト後にユーザーを特定のページに戻すには、post_logout_redirect_uri クエリ文字列パラメーターに URL を指定します。

認証プロバイダーをブロックする

既定では、すべての認証プロバイダーが有効になっていますが、アプリでプロバイダーの使用を制限することもできます。たとえば、アプリでは、メールアドレスを公開するプロバイダーのみを使用したい場合があります。

プロバイダーをブロックするには、ブロックされたプロバイダー固有のルートへの要求に対して 404 状態コードを返すルート規則を作成します。たとえば、Entra ID (旧 Azure Active Directory、"AAD") プロバイダーを制限するには、次のルート規則を追加します。

{
  "route": "/.auth/login/aad",
  "statusCode": 404
}

個人データの削除

エンドユーザーとしてアプリケーションに同意すると、ID プロバイダーに応じてメールアドレスまたはユーザー名に、そのアプリケーションからアクセスできるようになります。この情報が提供されたら、アプリケーションの所有者は、個人データをどのように管理するかを決定できます。

この情報をシステムから取り消すには、エンドユーザーは、個々の Web アプリの管理者に連絡する必要があります。

Azure Static Web Apps プラットフォームから個人データを削除し、今後の要求でプラットフォームからこの情報が提供されないようにするには、以下の URL を使用して要求を送信します。

https://identity.azurestaticapps.net/.auth/purge/<AUTHENTICATION_PROVIDER_NAME>

To prevent the platform from providing this information on future requests to individual apps, submit a request using the following URL:

https://<WEB_APP_DOMAIN_NAME>/.auth/purge/<AUTHENTICATION_PROVIDER_NAME>

If you're using Microsoft Entra ID, use aad as the value for the <AUTHENTICATION_PROVIDER_NAME> placeholder.

Tip

For information about general restrictions and limitations, see Quotas.

次のステップ

ルートを使用して、許可されたロールを設定してページアクセスを制御する

次の方法で共有