プロバイダーとロールのアクセスを構成する

2 分

ユーザー認証が適用されたあなたのショッピングリスト Web アプリには、ログインしていないユーザーが一部のページにアクセスするのを制限し、特定のプロバイダーを介してのみログインを許可する方法が必要です。

Web アプリへのユーザーアクセスを微調整するための Azure Static Web Apps 内のルーティング構成とロールについて調べます。

Azure Static Web Apps 用の構成ファイル

Azure Static Web Apps の構成は、次の設定を制御する staticwebapp.config.json ファイルで定義されます。

ルーティング
認証
承認
フォールバック規則
HTTP 応答のオーバーライド
グローバル HTTP ヘッダーの定義
カスタムの MIME の種類

staticwebapp.config.json の推奨される場所は、デプロイ時に選択した app_location 設定として設定されたフォルダー内です。ただし、このファイルは、アプリケーションのソースコードフォルダー内の任意の場所に配置できます。

このユースケースでは、必要なものを実現するためのルーティング構成について調べます。

認証プロバイダーを制限する

前のセクションでは、既定ですべての認証プロバイダーが有効になっていることを確認しました。これを変更するには、構成内にルーティング規則を追加します。

たとえば、GitHub プロバイダーでのログインを無効にするには、staticwebapp.config.json ファイル内に次のようなルーティング規則を追加します。

{
  "routes": [
    {
      "route": "/.auth/login/github",
      "statusCode": 404
    }
  ]
}

GitHub プロバイダーでの認証に使用されるルート /.auth/login/github が強制的に 404 (見つかりません) エラーを返すようにします。これにより、ユーザーがアクセスできなくなります。使用したくないプロバイダーをすべて無効にできるように、ルーティング規則はいくつでも必要な数だけ追加できます。

ロールを使用してルートをセキュリティで保護する

既定では、すべてのユーザーが制限なしでルートにアクセスできます。ルートをセキュリティで保護するには、1 つ以上のロール名を規則の allowedRoles 配列に追加します。既定では、すべてのユーザーが組み込みの anonymous ロールに属し、ログインしているすべてのユーザーが authenticated ロールのメンバーになります。

つまり、認証されたユーザーのみにルートを制限するために、組み込みの authenticated ロールを allowedRoles 配列に追加できます。

{
  "routes": [
    {
      "route": "/profile",
      "allowedRoles": ["authenticated"]
    }
  ]
}

その構成では、認証されていないユーザーが /profile ルートにアクセスしようとすると、エラー 401 (未承認) が返されます。

次のように、特定のルートに対する特定の HTTP メソッドを制限することもできます。

{
  "routes": [
    {
      "route": "/profile",
      "methods": ["PUT", "POST", "DELETE"],
      "allowedRoles": ["authenticated"]
    }
  ]
}

この例では、すべてのユーザーが /profile ルート上の GET メソッドにアクセスできますが、PUT、POST、DELETE のいずれかを使用できるのは、認証されたユーザーだけです。

ワイルドカードを使用する

ルートの末尾にワイルドカードを使用すると、基本パターンに従っているすべてのルートを一致させることができます。たとえば、/api で始まるすべての URL を認証済みユーザーに制限するには、次のコードを記述します。

{
  "routes": [
    {
      "route": "/api/*",
      "allowedRoles": ["authenticated"]
    }
  ]
}

次の手順