Firebase Google Login on Web

導入

「Capacitor」Social Login プラグイン Web プラットフォームをサポートしていません。. Web アプリケーションでは、より信頼性の高いポップアップベースの認証フローを提供するFirebaseの組み込みGoogle Sign-Inを直接使用する必要があります。

なぜWeb上でプラグインを使用しない?

「Capacitor」Social Login プラグインは、AndroidとiOSのネイティブモバイルプラットフォーム向けに設計されており、プラットフォーム固有の認証フローを活用できます。Webでは、Firebaseのネイティブ signInWithPopup ✅ 信頼性が高く、よりよくサポートされている

• ✅ ブラウザセッションストレージを自動的に管理する
• ✅
• ✅ Firebaseとのエラーハンドリングが向上しています
• ✅ 追加の設定が必要ありません

セットアップ手順

1. Firebaseプロジェクトの設定

   FirebaseプロジェクトでGoogle Sign-Inが有効になっていることを確認してください:

   • 以下の手順に進んでください Firebaseコンソール
   • 以下の手順に進んでください
   • 認証 > サインイン方法

2. Google Sign-Inプロバイダーを有効にします

   1. 認可されたドメインを追加します console.cloud.google.com
   2. を開く Authentication メニュー
   3. をクリックする Settings Firebase Authentication Sign-in Method ボタン
   4. Firebase Authentication 設定 Authorized Domains Authorized domains

「サンプル実装」のセクション

FirebaseのWebプラットフォーム向けに authUtils.ts サンプルアプリのファイルを参照してください。完全な実装が含まれています。

• Firebaseの signInWithPopup Webプラットフォーム向けに
• Capacitor Android/iOSプラットフォーム向けにSocial Loginプラグインを使用
• プラットフォームの自動検出をサポート

サンプルは、Web向けにFirebaseの組み込みメソッドを使用する場合、ネイティブプラットフォーム向けにプラグインを使用する方法を示しています。

関連情報

• Firebase Authentication Documentation - Firebase Authの完全なドキュメント
• ウェブ用のGoogleサインイン用Firebase - Firebaseの公式ガイド:ウェブ用のGoogleサインイン
• Googleログインセットアップガイド - 認可ドメインとOAuth承認画面の設定方法のガイド

Firebase Googleログインウェブから続けて

Firebase Googleログインウェブを使用している場合 Firebase Googleログインウェブを使用して 認証とアカウントフローの計画を行う場合、@__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-social-login Using @capgo/capacitor-social-login for the native capability in Using @capgo/capacitor-social-login, @capgo/capacitor-social-login Capacitor-capgo-capacitorの実装詳細について Capacitor-capgo-capacitor-パスキー Capacitor-capgo-capacitor-パスキーの実装詳細について Capacitor-capgo-capacitor-ネイティブバイオメトリック Capacitor-capgo-capacitor-ネイティブバイオメトリックの実装詳細について、 2要素認証 Capacitor-__CAPGO_KEEP_0__-__CAPGO_KEEP_1__-2要素認証の実装詳細について