Question

我正在创建一个AngularJS客户端来与两个ASP.Net Core（v2.0）API进行交互，所有这些API都要使用Azure AD进行保护。由于需要使用角色和组，我们将使用v1端点，因此使用ADAL.js. UI客户端必须是每个API的单独项目，另外UI项目不是Visual Studio项目，而是具有npm的VSCode。在我正在使用的UI项目中：

AngularJS 1.6.9
UI-Router 1.0.15
ADAL.js 1.0.17

经过长时间的反复试验，我在完成以下步骤后终于获得了对API进行身份验证的用户界面：

在UI项目中，我在Adal init（）函数中包含了端点：

var endpoints = {
    'http://localhost:8000/api0/': '<API_0_CLIENT_ID HERE>',
    'http://localhost:8001/api1/': '<API_1_CLIENT_ID HERE>',
};

adalAuthenticationServiceProvider.init(
  {
    tenant: 'slurm.onmicrosoft.com',
    clientId: '00000000-0000-0000-0000-XXXXXXXXXX',
    endpoints: endpoints
  },
  $httpProvider
);

有两个端点，一个是每个API的基本URL，每个端点都有一个相应的clientId，用于在Azure AD中注册每个api时分配的API。此外，在Azure AD中注册时，UI项目被授予对每个API的适当权限。一旦我在init（）函数中设置了这些端点，并且UI具有API的每个clientId，UI就能够正确地对两个API进行身份验证。这个问题终于让我想到了这个问题：32352325

如果我没有在UI项目中提供端点，则甚至不会将令牌传递回API，因此验证失败。

我不确定（没有明确的文档），是否应将UI clientId设置为每个API中的audienceId，或者是否将每个API客户端ID嵌入到UI中。

问题：

1）对于每个API 单独的AngularJS UI项目，并且每个项目在Azure AD中单独注册，我们是否将UI clientId注册为每个API的受众或允许客户端了解每个API clientId？

2）为什么看起来需要在客户端的ADAL init（）函数中指定端点？还是我错误地使用它们？

基于this Azure-Samples project的自述文件，用户界面应该知道每个API的clientId（在步骤3中，配置WebApp）：

在TodoListWebApp项目中，//...//找到TodoListResourceId属性并将该值替换为TodoListService应用程序的应用程序ID

但是，此示例不是SPA示例，因此不使用隐式流。

提前多多谢谢！

Answer 1

这是我最终推断的（经过大量的挖掘和试验和错误）。该示例再次假设UI是与任何API分开的项目。对于上面的原始问题：

1）对于与每个API分开的AngularJS UI项目，以及每个项目都在Azure AD中单独注册，我们是否注册了 UI clientId作为每个API的受众或允许客户端知道每个API clientId？

客户端UI了解每个API，但使用的是App ID URI

2）为什么似乎需要在ADAL中指定端点客户端上的init（）函数？还是我错误地使用它们？

继续阅读。

对于UI将访问的每个API，需要在端点映射结构中声明端点。例如，假设我尝试使用以下相关信息访问在AAD中注册的2个单独的API：

租户：slurm.onmicrosoft.com

<强> API_0
  主页网址：＆＃39; https://localhost:8000＆＃39;
  应用ID URI：＆＃39; https://slurm.onmicrosoft.com/00000000-0000-0000-0000-aaaaaaaaaaaa＆＃39;

<强> API_1
  主页网址：＆＃39; https://localhost:4000＆＃39;
  应用ID URI：＆＃39; https://slurm.onmicrosoft.com/00000000-0000-0000-0000-bbbbbbbbbbbb＆＃39;

adalAuthenticationServiceProvider.init(
  {
    tenant: 'slurm.onmicrosoft.com',
    clientId: '00000000-0000-0000-0000-XXXXXXXXXX',
    endpoints: {
        'localhost:8000': 'https://slurm.onmicrosoft.com/00000000-0000-0000-0000-aaaaaaaaaaaa',
        'localhost:4000': 'https://slurm.onmicrosoft.com/00000000-0000-0000-0000-bbbbbbbbbbbb',
    }
  },
  $httpProvider
);

以下是参考资料：

转到http://www.cloudidentity.com/blog/2015/02/19/introducing-adal-js-v1
滚动到通过CORS调用API
点击github示例的链接： https://github.com/Azure-Samples/active-directory-angularjs-singlepageapp-dotnet-webapi
关于github示例readme
转到步骤3：配置To Go API以使用Azure Active 目录租户
参见步骤＃7，其中说明：

输入To Go API端点位置到其资源的映射标识符或App ID URI。端点属性的名称 object应该是To Go API的位置。

另外，如果您查看代码示例，您将在ToGoAPI的web.config中看到，它表示“观众”和“＃39; value设置为ToGoAPI的App ID URI

注意：上面使用的App Id URI有意保留为与Azure AD将使用的默认值类似的格式注册申请时提供。这些可以改变（只要确保你随处更改）。

注意2：在端点映射中，您会看到密钥不包含方案，并且与相应的主页URL不完全匹配。当我加入该计划时，即https：//我从API获得了401响应

使用ADAL.js将ClientId用作SPA配置的端点中的受众

1 个答案: