简介
@arkadiuminc/ng-adal 是一个用于 Angular 开发的 npm 包，它提供了 Azure Active Directory 认证库的集成。使用这个库，开发者可以轻松地将 Azure AD 认证添加到任何 Angular 应用程序中。这篇文章将介绍如何使用 @arkadiuminc/ng-adal。
安装
在使用 @arkadiuminc/ng-adal 之前，确保已经安装 Node，然后使用以下命令安装 @arkadiuminc/ng-adal：
npm install @arkadiuminc/ng-adal --save
配置
在 Angular 应用程序中使用 @arkadiuminc/ng-adal，需要首先配置认证参数。可以在应用程序的任何地方进行配置，但我们推荐在 app.module.ts 文件中进行配置。在这个文件中，导入以下代码：
import { AdalService } from '@arkadiuminc/ng-adal';
export const config = {
tenant: '<Tenant URL e.g https://login.microsoftonline.com/xxx.onmicrosoft.com>',
clientId: '<Client Id e.g 9f756dcd-xxxx-xxxx-xxxx-fcbabc3318f6>',
redirectUri: 'http://localhost:4200/',
postLogoutRedirectUri: 'http://localhost:4200/',
}这个配置文件包含了 Azure AD 应用程序的认证参数。接下来，将这个配置文件注入到 AppModule 中：
-- -------------------- ---- -------
-----------
------------- ---------------
-------- ----------------
---------- -
-
-------- ------------
----------- -- -- -
------ --- --------------------
-
-
--
---------- --------------
--
------ ----- --------- - -现在，@arkadiuminc/ng-adal 已经配置完成。
使用
完成 @arkadiuminc/ng-adal 的配置后，可以使用这个库在 Angular 应用中进行 Azure AD 认证。下面是一个示例代码：
-- -------------------- ---- -------
------ - ---------- ------ - ---- ----------------
------ - ----------- - ---- -----------------------
------------
--------- -----------
--------- -
------- ------------------------ --------------------------------
------- ----------------------- ----------------------------------
---- ------------------------
----------- -- -------- -------
------
--
------- --
--
------ ----- ------------ ---------- ------ -
---------------- --------
--------- -------
------------------- ------------ ------------ - -
----------- ---- -
-------------------- - ----------------------------------------
-- ---------------------- -
------------- - ---------------------------------------
-
-
------- -
-------------------------
-
-------- -
--------------------------
-
-这个代码创建了一个 Angular 组件，它包含了两个按钮：一个用于登录，一个用于注销。如果用户已经登录，则会显示一个欢迎消息。在 ngOnInit 方法中，我们检查用户是否已经登录，将 isAuthenticated 设置为 true。如果用户已经登录，则使用 adalService 获取用户名。
如果用户未登录，则调用 adalService 的 login 方法，该方法会打开 Azure AD 认证页面，要求用户输入其凭据。如果用户已经登录并点击了注销按钮，则调用 adalService 的 logout 方法。
结论
在本文中，我们介绍了 npm 包 @arkadiuminc/ng-adal 的使用教程。使用该库，我们可以轻松地将 Azure AD 认证添加到 Angular 应用程序中。在应用程序中使用这个库，需要首先配置认证参数，然后使用该库进行用户认证。希望本文能够为开发者提供帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005726081e8991b448e88c8