Firebase AuthのLocal EmulatorはAuthProviderに応じて適切なダミーユーザを生成してくれる

公開日時

Firebase Local Emulator Suiteを使ってローカル開発を行う際に↓の設定をするとFirebase Authの接続先をエミュレータに変更できる。

firebase.auth().useEmulator('http://localhost:9099')

Google認証を使いたい場合に、エミュレータだとOAuth認証はどうなるんだろうと思って試してみたところダミーのOAuthユーザを生成してくれる仕組みになっていた。

↓でGoogleログイン用のポップアップを表示すると、既存のダミーユーザか新規ユーザを追加するかが選択できる。

const provider = new firebase.auth.GoogleAuthProvider()
await app.auth().signInWithPopup(provider)
local auth1

新規ユーザの場合は「Auto-Generate」ボタンをクリックするとダミーデータをいい感じに入力してくれる。

local auth2

ユーザ登録後にエミュレータUI(http://localhost:4000/auth)でカスタムクレームを設定することもできる。

local auth3

エミュレータがなかった頃は開発用のfirebaseプロジェクトを別途用意した上でfirebase admin sdkを使って都度ユーザのカスタムクレームを設定する必要があったので手間だった。

エミュレータのおかげでfirebaseを使ったサービスでもローカル開発がとてもやりやすくなった。

参考


Related #firebase

SharedArrayBuffer updates in Android Chrome 88 and Desktop Chrome 92

クロスオリジン分離対応を実施

Firebase Emulator Suiteで起動しているFunctionsから本番のFirestoreにアクセスする

functionsのみエミュレータを使うようにするとできる

Firebase Functions呼び出し時に Error: function terminated. が発生した場合

firebase functions:logで詳細を確認できる

Cloud BuildでFirebase Hostingのデプロイを行う

リポジトリへのpush以外をトリガーにしたい場合に使用

Firebase FunctionsでonCallで実装しているにも関わらずCORSエラーが発生した場合

Cloud Functions(GCP)の管理画面を確認してみる

JestでFirestoreセキュリティルールのテストを書く

Github ActionsでCIを回せるようになった