Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Firebase Authを Nuxt + Railsの自前サービス に導入してみた

184 views

Published on

主に、Rails側でJWTの検証&認証あたりの解決策を紹介します!

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Firebase Authを Nuxt + Railsの自前サービス に導入してみた

  1. 1. Firebase Authを Nuxt + Railsの自前サービス に導入してみた 澤井 友恵 @tomoeine
  2. 2. 自己紹介 フリーランスWebエンジニア 澤井友恵 @tomoeine エンジニアとしての黒歴史 ● 【高校中退】趣味のHP制作 ● 【大学】零細Web広告会社で1人システム部門バイト ● 【東京社会人】大手SIerに5年間SEとして勤務 ● 【宮崎】2016年~ 地元勤務(Web系自社サービス) ● 【フリーランス】2018年~ 山の中で在宅ワーク 最近触るもの ● Laravel、Rails、Vue.js、AWS 宮崎の岩は最高! 自己紹介
  3. 3. アジェンダ ● Firebase Authenticationとは? ● ゆるすけの紹介 ● NuxtでFirebase Authを使う ● 自前のバックエンド(Rails)と連携する ● まとめ アジェンダ
  4. 4. Firebase Authenticationとは?
  5. 5. アジェンダ ● ログイン機能が簡単に作れる ● メール&パスワードや各種SNSログインに対応 ● Firebaseの各サービスと連携できる Firebase Authentication とは?
  6. 6. 「ゆるすけ」で検索! ゆるくスケジュール共有する「ゆるすけ」
  7. 7. Stripe PHP vs Laravel Cashier $yarn add firebase NuxtにFirebase Authを導入する 割愛
「Firebase Auth Nuxt」でググると良い記事がたくさんでてきます

  8. 8. 自前のバックエンド(Rails) と連携する
  9. 9. Stripe PHP vs Laravel Cashier自前のバックエンドと連携 Nuxtでログインできたし、 あとはバックエンドと連携するだけやな・・・ SorceryやDevise使えないのは不便やが、 まぁなんとかなるやろ・・・(課題1) JWTのIDトークンをNuxtからRailsに渡して、 Rails側で検証して・・・ん??
  10. 10. Stripe PHP vs Laravel CashierRailsアプリでIDトークンを検証したい① ①認証
 ②IDトークン
 (JWT)返却
 ③IDトークン
 ④IDトークン検証
 ⑤ログイン成功

  11. 11. Stripe PHP vs Laravel CashierRailsアプリでIDトークンを検証したい② これこれ!! https://firebase.google.com/docs/auth/admin/verify-id-tokens?hl=ja https://firebase.google.com/docs/admin/setup/?hl=ja Rubyがない!!!! (課題2)
  12. 12. Stripe PHP vs Laravel Cashier認証Gemどうするの問題(課題1) Q. SorceryやDeviseなしでも認証周り楽にする方法ないの?(課題1) A. 「Knock」が使えました😆
  13. 13. Stripe PHP vs Laravel CashierAPIモードの認証ならKnock APIモードのRailsアプリで、JWT認証が手軽にできるやつ class Api::V1::HogePiyoController < ApplicationController before_action :authenticate_user def show p current_user.id end
  14. 14. Stripe PHP vs Laravel CashierRuby用のAdmin SDKない問題(課題2) Q. Ruby用のFirebase Admin SDKがないみたいだけど、JWTの検証どうす るの?(課題2) A. 検証ぐらい自前でいったれ💪  (対応言語で実装してごにゃごにゃ連携するのもあり?)
  15. 15. Stripe PHP vs Laravel CashierKnockのちからを借りつつJWT検証 ApplicationController # Knockの認証メソッドをオーバーライド module Knock::Authenticable def define_current_entity_getter(entity_class, getter_name) # 中略 response = client.get("https://www.googleapis.com/robot/v1/metadata/x509/securetoken@system.gserviceaccount.com") jwks_raw = response.body JSON.parse(jwks_raw).each do |_key, key_string| jwks_string = key_string.gsub("-----BEGIN CERTIFICATE-----", "").gsub("-----END CERTIFICATE-----", "").delete("n") Knock.token_signature_algorithm = "RS256" Knock.token_public_key = OpenSSL::X509::Certificate.new(Base64.decode64(jwks_string)).public_key begin @payload = Knock::AuthToken.new(token: token).entity_for(entity_class) break if @payload.present? rescue next end KnockにはJWTを公開鍵で検証する仕組みが備わっていますが、 公開鍵が固定になる
 一方Firebaseの公開鍵は定期的に変更されるので、 動的に取得する必要がある
 (遅くなるので鍵はキャッシュしておくと良い!) 

  16. 16. Stripe PHP vs Laravel Cashierログイン&新規登録 User.rb def self.from_token_payload(payload) // Userが入れば取得 user = find_by(sub: payload["sub"]) // いなければ新規作成 user || create!(sub: payload["sub"], user_name: payload["name"][0..29], remote_image_url: payload["picture"].sub(/_normal./, "_bigger.")) end
  17. 17. アジェンダ ● SPA+自前のバックエンド環境でも、 Firebase Authが使えた! ● RailsならKnockがオススメ! ● ただし少々の力技が伴う まとめ
  18. 18. ご清聴ありがとうございました🙌 澤井 友恵 @tomoeine Firebase Authを Nuxt + Railsの自前サービス に導入してみた

×