为了本课程的目的，我们将使用 Firebase 提供的身份验证功能。考虑到你已经部署到 Firebase Hosting 并安装和配置了 Firebase SDK，这样做是合理的。

Firebase 身份验证

Firebase Authentication 提供了多种身份验证选项，从匿名用户到电子邮件和密码，再到与 Google、Facebook、Twitter 和 GitHub 等联合身份提供方的集成。我们将使用基本的电子邮件和密码身份验证，但在本章末尾，你将学习如何通过几次点击启用其他提供方。

配置 Firebase 身份验证

点击 Run 并开始创建新分支：

1git switch -c add-user-auth

现在，首先要做的是，向 services/web/src/template.html 文件添加必要的 Firebase SDK 脚本。请将其添加在 /__/firebase/init.js 脚本 之前。

1<script src="/__/firebase/X.Y.Z/firebase-auth.js"></script>

将 X.Y.Z 替换为你在 Firebase Web 控制台中看到的 Firebase 版本。

配置 FirebaseUI

为简化起见，我们使用 FirebaseUI。这是一种快速上手的方式，无需担心“注册”与“登录”以及“忘记密码”的用户流程。

要启用 FirebaseUI，请在我们已更新的 template.html 文件中，在 %sapper.styles% 行上方添加以下样式表：

1<link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/4.6.1/firebase-ui-auth.css" />

接下来，我们需要在 /__/firebase/init.js 脚本下方添加 FirebaseUI 和 Firebase JavaScript，并初始化 UI 小部件：

1<!-- FirebaseUI -->
2<script src="https://www.gstatic.com/firebasejs/ui/4.6.1/firebase-ui-auth.js">
3</script>
4<script src="https://www.gstatic.com/firebasejs/4.6.1/firebase.js">
5  var firebaseAuthUi = new firebaseui.auth.AuthUI(firebase.auth());
6</script>

点击 Run 以保存文件中的更改。

PRESS RUN 以将代码推送到 GitHub。