0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Firebase AuthenticationのGoogle認証画面で「400: redirect_uri_mismatch」のエラー画面が表示される

Last updated at Posted at 2022-06-24

背景

  • Firebase + next.jsでWebアプリを開発
  • 巷に溢れているサンプルプログラムを参考にし、signInWithPopupでGoogleログイン画面を実装
  • Googleアカウント認証画面はポップアップしたが、「400: redirect_uri_mismatch」のエラーが表示された。かなり詰まったので備忘録として残す
    スクリーンショット 2022-06-24 0.13.05.png

解決

  • firebaseのAPIキーの値が、おそらくGoogle Authentication Providerを有効にしたタイミングで変わっていた
  • firebaseのコンソール画面でAPIキーを確認、設定し直したら解決した

経緯

  • よく分かっていないけど、初めはfirebase Authentication自体全く触らず、firestoreにデータを保存・参照するだけのWebアプリを作っており、途中でログイン機能を追加するために有効化したのが原因かもしれない
  • 変わる前のAPIキーでもfirestoreへのアクセスはできていたので気づかず、メッセージに従ってGCPコンソールのOAuth2.0設定を何度も見直したり、解決に何日もかかった。。。
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?