しばやん雑記

Azure Serverless とメイドさんが大好きなフリーランスのプログラマーのブログ

Azure Front Door Premium から Static Web Apps へのアクセスを Private Endpoint で保護する

少し前に Static Web Apps の Private Endpoint 対応がプレビューとして公開されました。Static Web Apps が GA のタイミングで使えるという話だったのが遅れてリリースされたものになります。

Private Endpoint を使うことで Express Route を経由して Private IP でアクセス出来るようになりますが、Static Web Apps にそのようなユースケースが存在しているのかは若干謎です。

個人的には Front Door Premium の Private Link との組み合わせが一番求められていると感じるので、Private Endpoint が使えるようになった記念で試しておきます。

以前に App Service と Blob Storage で試した時の記事は以下になります。結局は Private Endpoint が使えるようになっていれば良いので、設定方法はほぼ同じです。

設定方法ほぼ同じとはいえ、Front Door Premium と Static Web Apps の Private Endpoint 対応は両方ともプレビュー中なので、Azure Portal では完全にサポートされていません。

実際に Private Link を有効にしたオリジンを追加しようとすると、Target sub resource が選択できません。

f:id:shiba-yan:20210824164521p:plain

これは Azure Portal 側の問題となるので、オリジンを作成後に ARM Explorer などを使って直接 Private Link を有効化することで回避できます。

ARM Explorer で作成されたオリジンに対して sharedPrivateLinkResource を設定していきます。

PUT /subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/***/providers/Microsoft.Cdn/profiles/***/originGroups/default-origin-group/origins/default-origin?api-version=2020-09-01
{
  "properties": {
    "originGroupName": "default-origin-group",
    "hostName": "***.azurestaticapps.net",
    "httpPort": 80,
    "httpsPort": 443,
    "originHostHeader": "***.azurestaticapps.net",
    "priority": 1,
    "weight": 1000,
    "enabledState": "Enabled",
    "sharedPrivateLinkResource": {
      "privateLink": {
        "id": "/subscriptions/00000000-0000-0000-0000-000000000000/resourceGroups/***/providers/Microsoft.Web/staticSites/***"
      },
      "groupId": "staticSites",
      "privateLinkLocation": "westus2",
      "requestMessage": "Please approve this connection."
    },
    "provisioningState": "Succeeded",
    "deploymentStatus": "NotStarted"
  }
}

サブスクリプション ID やリソース名は適宜読み替えてください。id には Private Endpoint を有効化したいリソース ID を、groupId には Target sub resource 名を指定します。Static Web Apps の場合は staticSites が Target sub resource 名になります。

リソースを更新すると Azure Portal からも Private Link が有効化されているのが確認できます。

f:id:shiba-yan:20210824154006p:plain

まだこの状態では Front Door から Private Endpoint 経由での接続は確立されていません。

この後 Static Web Apps 側の Private Endpoint connections を確認すると Front Door からの Pending 状態の接続リクエストが表示されているはずです。自分が試した限りでは少し時間がかかりました。

f:id:shiba-yan:20210824153947p:plain

Front Door からの接続リクエストを Approve してあげることで Front Door から接続可能になります。

f:id:shiba-yan:20210824154020p:plain

Approve してからも少し接続完了までに少し不安定な時がありますが、しばらく待つと安定して Front Door から Static Web Apps へのアクセスが Private Endpoint 経由で行えるようになります。

以下は実際に Private Endpoint が有効になっている Static Web Apps にはアクセス出来ていないですが、Front Door 経由では問題なくアクセス出来ていることが確認できます。

f:id:shiba-yan:20210824154038p:plain

これで App Service や Blob Storage と同じように Front Door Premium と Private Endpoint でオリジンを保護しつつアクセスできるようになりました。Premium は高いので必要となる場面は少なそうですが、セキュリティを重視する場合に選択肢になると思います。