先日より、Azure Static Web Appsの検証をしています。今回はその続きです。

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

先日実施した認証機能の実装の際、下記にあった認証プロバイダーをブロックするという項目に目が止まり実装することにしました。

learn.microsoft.com

これを実装するには、設定ファイルとしてstaticwebapp.config.jsonファイルをReactアプリを格納しているフォルダ直下に置く必要があります。

learn.microsoft.com

記述内容として、最初は以下の記述を実装しました。

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

ただ、これではうまく動きません。理由を探っていたところswa startで起動した時に以下のメッセージが出ていることに気がつきます。

[swa] WARNING: Failed to read staticwebapp.config.json configuration from:
[swa]    /Users/miyohide/work/azure_static_web_apps_local/src/staticwebapp.config.json
[swa]
[swa] The following error was encountered: The property "route" is not allowed (Line: 0)
[swa] 0: {
[swa] 1:     "route": "/.auth/login/twitter",
[swa] 2:     "statusCode": 404
[swa] 3: }
[swa]
[swa] Please fix the above error and try again to load and use the configuration.
[swa] Read more: https://aka.ms/swa/config-schema

サンプル通りに記入したのになんで？と思っていたのですが、staticwebapp.config.jsonのドキュメントに書かれているサンプルをみてわかりました。

learn.microsoft.com

実際には、routesにて囲む必要がありました。具体的には以下のような記述をする必要がありました。

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

これを設定しておくと、/.auth/login/twitterにアクセスすると404が帰ってきました。

miyohide's blog

Azure Static Web Apps CLIを使ってローカル開発環境を構築する（3）

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