Firebase Authentication

Play Framework を始めたばかりの方向けに、サンプルを進めるうえで困ったところを共有する目的で書いています。 Play Framework 2.8.x にて、Firebase Authentication (LINE Login を利用した) サインインしたときのメモです。 以下、目次 前提 方針 結果 できてないところ 参考にしたところ 前提 セッション管理は Firebase Authentication に任せたい LINE Login は導入したい Play Framework でやりたい 方針 LINE Login について、ログインフローは pac4j にお任せ セッシ…

メール・パスワードによるアカウント認証機能を持つメモアプリを作ります。また、作成しメモはクラウドに保存されるため、他の端末からログインすれば同じメモを見ることができますし、編集もできます。メモアプリにわざわざ認証機能を追加する必要があるのかと考えればそれまでですが、勉強の一環として実践しようと思います。 デモンストレーション Firebaseについて Firebase Authentication Firebase Realtime Database アプリの仕様 画面遷移はActivityResultLauncherを主軸とする アクティビティの役割 アクションバーの非表示 レイアウトの作成…

firebase.google.com pub.dev 目的 仕事で認証系の処理に関わることがあり、なんとなく興味がわいた。SDKの使い勝手や認証プロセスをどこまで抽象化しているのか気になった。 自分で何かサービスを作ろうとしたときに、もはや認証は避けて通れない気がした。明示的なログインがなくともユーザの区別はつけたくなりそう。また、Firebaseの他機能を利用しようとするとAuthは必須なのでいい機会だと思った やったこと 公式サイトを見ながら、匿名ログインとgoogleログインだけ試した(Androidのみ)。実際のログイン処理はSDK内でやってくれるので、開発者はライブラリの呼び出しと…

はじめまして。 開発チームでAndroidエンジニアをしている松崎です。 今回は弊社のプロダクトである「nana」のAndroidアプリで初めて担当したFirebase Authenticationを使ったTwitter認証の機能を実装したお話をします。 なぜFirebase Authenticationを導入したのか nanaでは以前からTwitter認証に Twitter Kit for Androidを使用していました。 しかしある時期から「Twitterアカウントでのログインに失敗する」というユーザからの問い合わせが増えてきました。 原因について調査を進めたものの有効な解決策が見つけら…

Android・Kotlinで、Firebase Authenticationを使った、メールアドレスによるSignIn・SignUpの実装をしたので、簡単に手順をまとめてみたいと思います👷‍♀️ やっていく まずはFirebase Authentication Androidライブラリを、アプリレベルのGradleファイルに記述してインストールします。 dependencies { // ... implementation platform('com.google.firebase:firebase-bom:26.8.0') implementation 'com.google.fireb…

Firebase Authenticationでログイン機能を実装しようとして失敗したときのメモ。 FirebaseSDKのsignInWithPopup()を利用したところ、 コンソールに下記エラーを吐き出し、真っ白なままポップアップが閉じてしまいました。 Refused to display 'https://console.firebase.google.com/u/0/project/[PROJECT_NAME]/database/data/__/auth/iframe#id=I1_1234567891234&_gfid=I1_1234567891234&parent=https%3A…

Nuxt＋Firebase Authenticationを使用したソーシャルログイン実装方法を紹介します。 完成イメージ １．ソーシャルログインとは ２．実装方法 ２－１Firebaseでの作業 （１）Firebaseプロジェクトの作成する （２）Authentication の設定 （３）ウェブ設定の確認 ２－２Nuxtプロジェクトでの作業 （１）Nuxtプロジェクトの作成 （２）Firebase SDK の追加 （３）ログイン処理の実装 （４）ログアウト処理の実装 （５）ログイン状態確認処理の実装 （６）ログイン・ログアウト・状態確認の実装例 参考サイト 完成イメージ 今回はGoogle …

データベースの画像（サムネイル用） Next.jsを使う場合のDBについて 自分でバックエンドを書くか、BaaSを使うか Rails APIモードを使うよりも、FirebaseやSupabaseやPlanetScaleのほうが連携が簡単そうな予感がしています。 Rails APIモードを使う場合、Fly.ioなどを使ってサーバーを立てる必要があり、なおかつそのDBの使用量を考慮に入れる必要があります。 Fly.ioはデータが少なければDB代が全く掛かりません。しかしそれはBaaS（Backend as a Service） も同様です。SupabaseやPlanetScaleも、Hobby用と…

設計から学ぶFirebase実践ガイド Firebaseと開発における課題「設計から学ぶFirebase実践ガイド」 Firebaseを利用した開発を成功に導くノウハウ満載「設計から学ぶFirebase実践ガイド」 「設計から学ぶFirebase実践ガイド」書籍概要 「設計から学ぶFirebase実践ガイド」Amazonでの購入はこちら 「設計から学ぶFirebase実践ガイド」楽天市場での購入はこちら※電子書籍版です 設計から学ぶFirebase実践ガイド プログレスは、2023年3月31日に押野泰平氏、長谷川健史氏、岡田菜摘氏著書による、Firebaseを用いた設計・開発の実践的なノウハウ…

以下をなぞって、かんたんなAPIの作成、デプロイ、KVを試した zenn.dev Cloudflare Workers wranglerを使えばデプロイ・KVの追加など非常にかんたん、これがDXが良いってやつか〜 KVは結果整合というやつで、リアルタイム性が求められるデータには無理。キャッシュと、静的ファイルの配信に使うものっぽい Durable Objectは強整合、リアルタイムなやつはこっち（チャットアプリのバックエンドとしての公式デモがある） Hono Honoはとてもよくて、Expressを書いたことがあればあまり頭使わずにエンドポイントを生やせる （Workersの仕様にもよるのだろ…

Firebase Authentication を使った Flutter アプリを開発している。ログインプロバイダーが増減したときのイベントを取得したい。 たとえば、ユーザーアカウントに Apple アカウントが接続されている時には「Appleアカウントと連携中！」と表示し、接続解除時には「Appleアカウントと未接続！」と表示したい。 認証プロバイダーの増減を監視する よく紹介されている authStateChanges() を監視する方法ではうまく動かなかった。昔のバージョンではイベントが発火していたのかもしれないが、現行のバージョンでは linkWithProvider() や unli…

firebase Auth の JWT (id token) を header に乗せて GraphQL のクエリを発行するメモ React-Query + GraphQL request で JWT token を使う方法 環境 graphql 16.6.0 graphql-request 6.0.0 @tanstack/react-query 4.29.3 import { useQuery } from 'react-query'; import { GraphQLClient } from 'graphql-request'; function MyComponent() { cons…

注意事項 この記事は、Notion AIに対して 問題と解決策の概要 例示用のコード を渡して生成した実験的な記事になります。 はじめに FlutterとFirebaseを使用してGoogle認証を導入する方法について説明します。 Google認証を導入することで、ユーザーが簡単にアプリにログインできるようになります。 本記事では、FlutterとFirebaseを使用してGoogle認証を導入するためのステップバイステップの手順をご紹介します。 事前準備 事前に以下のツールがインストールされていることが前提です。 Flutter SDK Firebase CLI アプリの画面構成 今回作るア…

注意事項 この記事は、Notion AIに対して 問題と解決策の概要 例示用のコード を渡して生成した実験的な記事になります。 作ったサービス 入力した情報を元に、ブログのアウトラインと要点を生成してプレビューしてくれるサービスです。 wordy.zuki.dev かなり雑に作っているので、使い勝手がいいとは思いませんが、元々の目的は達成できたので問題ありません。 モチベーション Open AIのAPIと連携させて、ほぼ100%でJSONを吐かせる Firestore触ってみたい Firebase AuthenticationとCloud FunctionsでAPIを楽に作れるのかを確認したい…

この記事では、Firebase Authenticationを使ったNestJSでの認証機能を作成する方法を解説します。 要約 Passportを利用する Firebase Admin SDKをインストールする Firebaseの認証ロジックを実装したPassportの実装を行う コントローラーにPassportによるGuardを設定する 内容 まずは、PassportというNode.jsの認証ライブラリを使用します。NestJSでは、@nestjs/passportモジュールを使用してこのライブラリを利用することができます。以下のようにnpmモジュールをインストールします。 $ npm in…

初めに こんにちは、株式会社 LegalOn Technologies の LegalForceキャビネ開発部でテックリードを務めている横道と申します。 私たちのプロダクト、「LegalForceキャビネ(以下キャビネ)」では Google Firebase を使用しています。 この Google Firebase を、実際のプロダクト開発と運用で使用した際に生じた課題と対応ついて、「Firebase 使用上の注意 Functions 編」「同 Firestore 編」の 2 つに分けてお送りします。 今回は Functions 編として、Firebase Functions を使ったプロダク…

FlutterFlowで作成！テンプレートでタスク登録アプリ ー 第5回 ユーザー編集を修正してみよう。 1.ユーザ編集画面：Edit Profileについて 1.1.メールアドレスの更新について 1.2.ReadOnlyの設定 2.画像アップロードの準備 2.1.Firebase Storageの設定 2.2.FutterFlowの設定 3.画像アップロードをしよう 3.1.アップロードボタンの追加 3.2.アップロード処理を追加しよう 3.3.画像表示をしよう 4.Users更新処理を修正しよう 5.その他必要な処理の追加 5.1.アップロードしたものを初期表示する 5.2.画像削除（Ac…

出来事 打合せ向け資料整理 次回の顧客との打合せに向けて、既存システムのどのデータを利用できるかの目星をつけ、ディスカッションするための資料作成を進めている。 ここ最近やっと手が動くようになってきたので、手が動かなかった理由を振り返ると以下が解消されたために前に進むようになった。これは次期PJの上流工程でも先手先手で解消していきたい 既存システムに対する資料が少なすぎた（設計書がもらえてなかった） そのため、あくまで予想でしか物事を考えられなくて実態（ドキュメント）を起点としたディスカッションが出来なったため。 会話すべき顧客側担当者のアサインがされてなかったため、話が前に進まなかった。 打合…