Logo
Section 1 / 14

设置 Firebase

在本课程中,我们将学习如何快速配置 Firebase 的身份验证功能。

导入

设置 Firebase

在本课程中,我们将学习如何快速配置 Firebase 的身份验证功能。

我们将为应用程序实现身份验证功能。这一过程需要后端来处理用户的凭证信息。我们可以采用多种方式来实现,没有一种适用于所有场景的通用解决方案。

本课程主要聚焦于 Angular。开发后端解决方案是一个独立的主题,需要专门的课程来讲解。幸运的是,市面上存在一些无需自行搭建或编写服务器即可提供后端服务的解决方案。

在本课程中,我们将使用 Firebase。它是一个完整的开发平台,具备支撑应用程序所需的基础架构。我们可以利用 Firebase 安全地存储用户数据并实现用户登录功能,使用起来非常简单。

创建应用

Firebase 的一大优势是初始阶段完全免费。这使你可以在投入之前先进行测试。如果应用对资源需求较高,后续会产生费用。但对于本课程所构建的应用来说,免费套餐已经足够。

你需要一个账户才能开始。请访问 https://firebase.google.com/ 创建账户。

登录后,在页面顶部会有一个链接,可带你进入 Firebase 控制台。

...
控制台菜单链接

你会看到一个列出当前账户下所有项目列表的页面。点击 添加项目。

...
点击“添加项目”

接下来需要为项目命名。你可以随意填写,我将使用名称 angular-auth。输入框下方会自动生成一个 ID,用于确保项目名称不与其他 Firebase 应用冲突。

...
将项目命名为“angular-auth”

下一步会询问是否启用 Google Analytics。虽然这可能是未来项目中需要的功能,但本课程并不需要。建议将其关闭。

...
关闭 Google Analytics 集成

系统将为你生成一个新的 Firebase 应用。恭喜!你已成功创建第一个 Firebase 应用,且无需编写任何代码。

启用身份验证功能

你将被带入应用的控制台界面。在左侧边栏中,找到 开发 下的 身份验证 选项,并点击进入。

...
进入“身份验证”部分

接下来需要设置登录方式。

...
点击“设置登录方法”

Firebase 支持多种登录方式,包括社交媒体登录。我们选择 邮箱/密码 方式。点击启用该选项。注意,有一个选项可以开启无密码登录,但请保持其关闭状态。

...
启用邮箱/密码登录方式

准备就绪!接下来将在下一课中配置 Firebase。

自定义验证器

使用 Angular 配置 Firebase