Azure客户端应用程序访问由AD保护的Azure API

时间:2018-02-06 15:46:45

标签: azure azure-active-directory

我有一个Angular 5应用程序和一个web api应用程序,两者都托管在Azure中。

他们已在网站级别使用Azure AD进行保护,例如不允许匿名访问。

浏览Angular网站时,它要求我登录正常,我可以访问使用本地cookie获取令牌/声明信息的.auth/me

我现在想要打电话给单独的api,但不知道如何去做。

两个站点在Azure AD中都有一个应用程序,我已将客户端设置为具有“访问API”的委派权限。

我尝试使用来自客户端的本地cookie来访问api(不确定这是否可行)并且令牌返回.auth/me但是都不起作用。

在我的客户端清单中,我有以下内容:

"resourceAppId": "3cddd33c-2624-4216-b686-7f8fa48f38cf", // api id
  "resourceAccess": [
    {
      "id": "c2712c68-ea93-46d2-9874-61b807b19241",
      "type": "Scope"
    }
  ]

但是还没有看到任何额外的范围添加到声明中,是吗?

2 个答案:

答案 0 :(得分:1)

根据您的描述,您已经为Angular应用程序和web api应用程序创建了单独的AAD应用程序,并为Angular AAD应用程序配置了委派权限以访问web api AAD应用程序。

根据我的理解,您使用内置App Service Authentication / Authorization进行身份验证,此时您无需更改应用后端的代码。您可能已将请求未经过身份验证时>设置为使用Azure Active Directory登录,而不是允许匿名访问,此时您的应用服务会直接重定向用户用于身份验证记录后,您的客户端可以访问https://{your-angular-app-name}.azurewebsites.net/.auth/me以检索记录的用户信息。要访问您的web api网站,您只需在角客户端发送以下请求:

GET https://{your-webapi-app-name}.azurewebsites.net/api/values
Header Authorization:Bearer {id_token or access_token of AAD}

<强>更新

  

这正是我试图实施的路线。但缺少一件事,我不得不将客户端应用程序ID添加到Azure中api应用程序的allowed token audience

要检索access_token,您需要在Angular Web应用程序中为AAD提供程序设置其他设置,如下所示:

"additionalLoginParams": [
  "response_type=code id_token",
  "resource=<AAD-app-id-for-your-webapi-webapp>"
]

您可以按照类似issue的详细信息进行操作。

使用EasyAuth服务器流进行日志记录,您将获得access_token,您可以利用https://jwt.io/解码您的令牌,如下所示:

enter image description here

将access_token作为持票人令牌传递到您的webapi网络应用程序,此时您无需具体确定允许的令牌听众

此时,您可以针对您的Angular网络应用调用.auth/refresh来刷新access_token,然后您可以使用新的access_token访问您的webapi网络应用。

  

我希望角色中包含角色,所以可能必须坚持使用id?

如果您希望Web API向Angular应用程序公开访问范围,该访问范围将作为scp属性包含在access_token中,您可以按照配置资源应用程序来公开Web API tutorial部分。此外,您还可以关注Application roles

<强> UPDATE2:

您可以按照Authorization in a web app using Azure AD application roles & role claims获取详细的教程和代码示例。

答案 1 :(得分:0)

通常的方法是使用ADAL.JS(或MSAL.JS与AAD v2端点/ B2C)来获取API的访问令牌。

ADAL.JS使用隐藏的iframe在Azure AD中使用用户的活动会话获取访问令牌。

您可以在此处找到一个示例Angular应用:GitHub

ADAL.JS配置中一个特别重要的部分是here

var endpoints = {
    // Map the location of a request to an API to a the identifier of the associated resource
    "https://myapi.azurewebsites.net/": "https://myaadtenant.onmicrosoft.com/MyApi"
};

属性名称/键应该是API的URL。 ADAL-Angular检测从此开始的URL调用,并将正确的访问令牌附加到它们。

该值应该是API的App ID URI。您可以从Azure Active Directory中的API应用程序注册中找到它 - &gt;应用注册 - &gt;所有应用 - &gt;您的API - &gt;设置 - &gt;属性。

您需要从SPA的应用注册中启用Angular应用上的隐式授权流程。你可以从Manifest找到它。