介绍
ng7-auth 是一个用于 Angular 7 的身份验证模块，方便用户实现认证功能。此模块使用了基于 Token 的身份验证方式，作者还提供了相关的服务是帮助用户处理身份验证和刷新 Token。使用 ng7-auth，你可以轻松地将身份验证与你的 Angular 应用程序进行集成。
使用方法
安装
首先，你需要将 ng7-auth 安装到你的 Angular 项目中。你可以通过运行以下命令来完成安装：
npm install --save ng7-auth
导入并配置模块
安装完成后，你需要将 ng7-auth 模块导入到你的应用程序中。在你的 Angular 根模块中，添加以下内容：
-- -------------------- ---- ------- ------ - -------- - ---- ---------------- ------ - ------------- - ---- ---------------------------- ------ - ---------------- - ---- ----------------------- ------ - -------------- -------------- - ---- ----------- -- ------- ----------- ------------- --------------- -------- - -------------- ----------------- ----------------------- ------- --------------------------- -- ------ --- --- --------- -------------- ------------ ---------------- -- -- ---------- ----------------- ---------- -------------- -- ------ ----- --------- --展开代码
Ng7AuthModule.forRoot 中的配置是必须的，而且可能需要进行一些调整。apiUrl 配置项表示你的 Angular 应用需要向哪个 API 请求身份验证相关的数据。loginUrl 和 registerUrl 分别表示登录和注册页面的路径。
在组件中使用
一旦你已经成功配置好 ng7-auth 模块，你就可以在你的组件中使用它了。向模块中注入 Ng7AuthService，这个服务提供了一些有用的方法，例如 login、register 和 logout。
以下是一个简单的登录示例：
-- -------------------- ---- ------- ------ - ---------- ------ - ---- ---------------- ------ - -------------- - ---- ----------- ------------ --------- ------------ ------------ ------------------------- ---------- ------------------------- -- ------ ----- -------------- ---------- ------ - ----- - --- -------- - --- ------------------- ----- --------------- -- ---------- -- ------- - ----------------- ------ ----------- --------- ------------- ------------- ---- -- - ------------------ -- ---------- -- ----- -- - --------------------- ------- -- ---- - -- - -展开代码
在上面的代码示例中，我们定义了一个 LoginComponent 组件，组件中包含 email 和 password 两个文本框，用户可以输入相关信息后点击按钮进行登录。调用 auth.login 方法向服务器发送登录请求，并将用户输入的数据作为参数传递给 Ng7AuthService。在请求成功后，我们输出了响应数据，可以在浏览器控制台查看。
总结
ng7-auth 是一个很棒的身份验证库，可以帮助我们轻松地处理身份验证和刷新 Token 的问题。使用 ng7-auth ，我们可以尽可能地减少我们编写身份验证代码的工作量。同时，由于我们使用了基于 Token 的身份验证方式，可以降低我们使用 Session 的复杂性。希望这篇文章对你学习和使用 ng7-auth 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600668e2d9381d61a35409c1
