electron で firebase auth を使う

概要

electron で firebase auth を使う場合、 Twitter や Facebook、 Github などの認証で signInWithPopup や　signInWithRedirect といった便利なメソッドで認証を行うことができません。

email/password 認証は使えますが最近は Twitter などでログインするのが普通なのでできればそういった方法でログインを行いたいという気持ちがあります。

そういった願いを叶えるために electron & firebase auth の構成で Twitter などの認証を行うためには自前でログインフローを処理した後に取得した token を使って credential を作成し、 firebase auth の signInWithCredential に渡してあげる必要があります。

参考: https://firebase.google.com/docs/auth/web/github-auth#handle_the_sign-in_flow_manually

ここで問題なのは自前でログインフローを処理する部分が結構面倒ということです。

考慮しなければいけないこととして

• OAuth1, OAuth2 の違い
  • 例えば Twitter は　OAuth1、 Github は OAuth2 を使用しています
• OAuth2 の Grant Type による処理の手順の違い
  • OAuth2 には Grant Type と呼ばれる token の受け取る方法が4種類あり、それぞれ微妙にフローが違います。 厄介ですね...

また electron では nodejs の net module ではなく, electron の net module を使うことが推奨されているのでできればそちらを使いたいという思惑もあります。

参考: https://github.com/electron/electron/blob/master/docs/api/net.md

そこでそれらの問題を解決するために electron 用の OAuth1/OAuth2 のヘルパライブラリを作りました。

Electron OAuth Helper

これはOAuth1とOAuth2の全ての Grant Type をサポートしています。 Refresh Token に関しては後日対応予定です(投稿した日現在)。

OAuth に必要なパラメータとOAuth に使用する window を渡してあげることで認証フローが開始され、認証が行われると token が取得できます。

細かいことは考えなくていいので簡単に使えます。

firebase を使わない場合でも使えるので OAuth が必要になったときは車輪の再発明をしないためにも是非使ってみてください。

まだハードに使い込んでいないので使い難いところやバグがあるかもしれないのでもし見つけたら issue にしてください。 爆速で直します。

まとめ

• electron と firebase auth で発生する問題点を説明しました
• それらを解決する方法として Electron OAuth Helper を紹介しました