Firebase Google Login on Web
安装
简介
标题:简介Capacitor 社交登录插件 不支持 Web 平台. For web applications, you should use Firebase’s built-in Google Sign-In directly, which provides a more reliable popup-based authentication flow.
为什么不在 Web 上使用该插件?
标题:为什么不在 Web 上使用该插件?Capacitor 社交登录插件是为 native 移动平台(Android 和 iOS)设计的,可以利用平台特定的身份验证流程。对于 Web,Firebase 的原生方法是: signInWithPopup ✅ 更可靠和更受支持
- ✅ 自动处理浏览器会话存储
- 不支持 web 平台。对于 web 应用程序,您应该直接使用 Firebase 的 Google Sign-In,提供更可靠的弹出式身份验证流程。
- ✅ 提供更好的错误处理
- ✅ 不需要任何额外的配置
设置步骤
设置步骤-
配置 Firebase 项目
确保您的 Firebase 项目已启用 Google Sign-In:
- 前往 Firebase 控制台
- 导航到身份验证 > 登录方法
- 启用 Google Sign-In 提供程序
-
添加授权域名
- 前往您的项目概览 console.cloud.google.com
- 打开
Authentication菜单
- 点击
Settings按钮
- 示例实现
Authorized domains
- 前往您的项目概览 console.cloud.google.com
Example Implementation
Section titled “Example Implementation”查看示例应用中的 authUtils.ts 文件以了解完整的实现方法,包括:
- 使用 Firebase 的
signInWithPopup适用于 Web 平台 - 使用 Capacitor 社交登录插件(适用于 Android/iOS 平台)
- 自动检测平台
示例展示了如何在 Web 平台上使用 Firebase 内置方法,同时在 native 平台上使用插件
额外资源
“额外资源”部分- Firebase 身份验证文档 - 完整的 Firebase Auth 文档
- Firebase Google Sign-In for Web - Firebase 官方指南:Google Sign-In Web
- Google Login Setup Guide - 配置授权域名和 OAuth 同意屏幕指南
Keep going from Firebase Google Login on Web
继续使用 Firebase Google Login on WebIf you are using 使用 Firebase Google Login on Web Using @capgo/capacitor-social-login 使用 @capgo/capacitor-social-login 为 @capgo/capacitor-social-login 原生能力 为 @capgo/capacitor 社交登录实现细节 @capgo/capacitor-passkey 为 @capgo/capacitor-passkey 实现细节 @capgo/capacitor-native-biometric 为 @capgo/capacitor-native-biometric 实现细节, 双因素认证 为双因素认证实现细节。