AzureのStatic Web AppsにIP制限をかける方法

やりたいこと

Next.jsで開発したWebアプリにIP制限をかけたい

事前準備

その１. 構築するStatic Web AppsはStandardプランである必要があります。無料プランだとできないので、注意。

その2. pipelineを作成済みであること。
Pipelineを作成されてない方は↓で構築してください。

方法

1. プロジェクトに設定ファイルを作成

プロジェクトのルートにstaticwebapp.config.jsonを作成

2. jsonファイル内を記載

staticwebapp.config.json

{
    "networking": {
      "allowedIpRanges": [
        "<ここにipアドレスを記載>",
      ]
    }
  }

3. commitして実行

おそらく再デプロイが走って、IP制限がかかっていると思います。

staticwebapp.config.jsonでその他設定できること

その他にはグローバルヘッダーの設定や、ルートごとのアクセス権なども設定することができます。