概要

Firebase Authenticationを利用してGoogleログイン機能を実装する際、デフォルトではexample.firebaseapp.comのような文字列が表示される。これを独自のドメインに変更する手順を書き残しておく。

手順

1. 承認済みのリダイレクトURIを追加する

まず、GCPコンソールから「APIとサービス > 認証情報」に移動する。OAuth 2.0 クライアント IDの一覧に「Web client (auto created by Google Service)」が存在すると思うので、編集アイコンをクリックする。承認済みのリダイレクト URIに https://hoge.com/__/auth/handler のような独自ドメインのURIを追加する(※__/auth/handlerの部分は固定)。

2. Firebase Hostingに静的サイトをデプロイする

FirebaseでGoogleログイン機能を実装する場合は、必ずこの手順が必要になるらしい。テキトーで良いので何かデプロイしておく。

3. Firebase Hostingにカスタムドメインを追加する

先ほど、承認済みのリダイレクト URIに追加したドメイン(例: hoge.com)を追加する。モーダルが表示されると思うので、書かれている手順に従って、AレコードをDNSに追加する。しばらくすると、ステータスが保留中になるはず。

4. Firebase configのauthDomainを書き換える

Firebase接続クライアントのconfigにあるauthDomainパラメータを独自ドメインに書き換える。

参考URL