概述
Firebase 是一个由 Google 提供的后端服务平台，可以帮助开发者快速搭建应用程序。Firebase 提供了各种功能，包括实时数据库、云存储、身份验证等等。在本文中，我们将会介绍如何在 Angular 2 中使用 Firebase 实现用户认证。
准备工作
在开始之前，您需要安装以下软件：
- Node.js
- Angular CLI
- Firebase
如果您还没有安装这些软件，可以参考以下链接进行安装：
创建 Angular 2 项目
首先，我们需要创建一个 Angular 2 项目。在命令行中输入以下命令：
ng new my-app cd my-app
在创建完成后，我们可以使用以下命令启动应用程序：
ng serve
在浏览器中打开 http://localhost:4200/，您将会看到一个欢迎页面。
配置 Firebase
接下来，我们需要将 Firebase 集成到我们的应用程序中。首先，我们需要在 Firebase 控制台中创建一个新项目。在创建完成后，我们需要获取 Firebase 的配置信息。
在 Firebase 控制台中，点击“添加应用程序”，选择“Web”，然后输入您的应用程序名称。在下一步中，您将会看到 Firebase 的配置信息，包括 API 密钥、项目 ID 等等。
将这些信息复制到 src/environments/environment.ts 文件中：
-- -------------------- ---- -------
------ ----- ----------- - -
----------- ------
--------- -
------- ---------------
----------- -------------------
------------ --------------------
---------- ------------------
-------------- ----------------------
------------------ ---------------------------
------ --------------
-------------- ---------------------
-
--我们还需要在 app.module.ts 中导入 Firebase 模块：
-- -------------------- ---- -------
------ - ----------------- - ---- ----------------
------ - ----------- - ---- ------------------------------
-----------
-------- -
-----------------------------------------------------
--
------------- -
------------
--
---------- --------------
--
------ ----- --------- - -现在，我们已经成功地将 Firebase 集成到了我们的应用程序中。
实现用户认证
接下来，我们需要实现用户认证功能。首先，我们需要导入 AngularFireAuth 模块：
import { AngularFireAuth } from '@angular/fire/auth';然后，我们可以在构造函数中注入 AngularFireAuth 服务：
constructor(private auth: AngularFireAuth) { }现在，我们就可以使用 AngularFireAuth 服务来实现用户认证了。下面是一个示例代码：
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - --------------- - ---- ---------------------
------------
--------- -----------
--------- -
---- ---------------- - ----- -- ----- ---- -----------
------------ -- ---------------- --------
------- ----------------------------------
------
------------ -----------
---------- ----------
------- ----------------------- ---- ---------------
--------------
-
--
------ ----- ------------ -
------------------- ----- ---------------- --
------- -
----------------------------- ------------------------------------
-
-------- -
--------------------
-
-在上面的代码中，我们使用了 auth.user | async 来订阅用户认证状态。当用户已经登录时，我们将显示欢迎页面和一个注销按钮。当用户没有登录时，我们将显示一个登录按钮。
在 login() 方法中，我们使用 signInWithPopup() 方法来打开 Google 登录窗口。在 logout() 方法中，我们使用 signOut() 方法来注销当前用户。
总结
在本文中，我们介绍了如何在 Angular 2 中使用 Firebase 实现用户认证。我们首先创建了一个 Angular 2 项目，然后将 Firebase 集成到了我们的应用程序中。最后，我们使用 AngularFireAuth 服务来实现用户认证功能。
Firebase 提供了很多其他功能，例如实时数据库、云存储等等。如果您对 Firebase 感兴趣，可以参考 Firebase 官方文档，了解更多信息。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65c0690dadd4f0e0ffa47f72