経緯
Reactで作成したアプリにCognitoを使用して、ログイン機能を追加した。
通常のメールアドレスを使用した認証は問題ないが、どうもGoogleアカウントを使用した認証にて下記エラー。
このアプリは Google の OAuth 2.0 ポリシーを遵守していないため、ログインできません。
このアプリが無効なリクエストを送信したため、ログインできません。しばらくしてからもう一度お試しいただくか、この問題についてデベロッパーにお問い合わせください。 このエラーの詳細
このアプリのデベロッパーの場合は、エラーの詳細をご確認ください。
エラー 400: redirect_uri_mismatch
Google Cloud側には、リダイレクトURIをアプリケーションのドメインで設定したけど、何でダメなの??
結論
順序的には、アプリケーション→Cognito→Googleになるため、
・Google Cloud側には、Cognitoのドメイン + /oauth2/idpresponse
・Cognito側には、アプリケーションのドメイン
をリダイレクトURIに登録するのが正解でした。。。
OAuthの認証フローを、ちゃんと理解すれば簡単に解決する話でした。
おまけ
調べてる最中、ちょくちょく「Hosted UI」というのが出てきたので調べてみた。
Hosted UI:Cognitoが提供する認証用の「組み込みログイン画面」。
↓こんなやつ
