如何保护 Azure API 管理中的 API，然后通过 Angular (adal-angular5) 访问？

Question

背景

1. 我在 Azure-API-Mangement 中创建了一个测试 API。只要我提供“订阅密钥”，我就可以从 API 获取数据。我不知道如何设置安全性以链接到 Azure AD。

2. 我正在 Angular 中创建一个 SPA，并且正在使用 adal-angular5。我在 SpikesApps 上遵循了这个优秀的指南，但是我使用的是adal-angular5而不是adal-angular4。我能够获得登录用户的 1296 个字符的令牌。请看下面的截图：

上面链接的 SpikesApps 指南正在连接到作为 Azure WebApp 创建的 API，而不是 Azure-API-Management 的一部分。该指南使用用户令牌并将其作为 HTTP get 中的标头提交。（授权：Bearer [user 1296 char token]）。

我对 Azure 的有限了解告诉我，为 Azure WebbApp API 设置安全性与 Azure-API-Management 中的 API 不同。

我的情况与 SpikesApps 指南的不同之处（因此我被卡住了），是我想安全地连接到作为 Azure-API-Management 一部分的 API。

我的问题：

1. 是否可以在 Azure-API-Management 中保护 API，以便我的 Angular SPA 可以通过提供Authorization: Bearer <user 1296 char token>标头来访问它？（即根据SpikesApps 指南中访问的 API ）。

2. 如果没有，我有什么选择？

3. 我已经阅读了一些关于 Azure-API-Management 中 API 的“validate-jwt”策略。如果这是唯一的方法，我如何获得 JWT？我假设 JWT 与我已经拥有的 1296 个字符用户令牌不同？

截图

（显示在我的 Angular SPA 中由 adal-angular5 获得的用户信息）

（的阿达勒-angular5如何添加授权报头，以获取请求为例。https://www.npmjs.com/package/adal-angular5）

Answer 1

在发布上述问题后一个小时就找到了解决方案（在此之前我浪费了很多小时！）。

需要将validate-jwt添加到 API 的入站策略。

我按照本页上的（部分）说明进行了操作：https : //docs.microsoft.com/en-us/azure/api-management/api-management-howto-protect-backend-with-aad#configure -a-jwt-validation-policy-to-pre-authorize-requests

真的只需要做到以下几点：

1. 在 Azure AD 中创建“应用注册”以与 APIM 中的 API 关联。我们称之为后端应用程序
2. 在 API 管理中，修改相关 API 的入站组件的策略，按照下面的屏幕截图添加代码
3. 发出 GET 请求时，标头需要包括：（<Authorization: Bearer {USER_TOKEN}>根据上述原始问题中的指南）
4. 不要忘记在 GET 请求中包含订阅密钥。