【问题标题】:ADAL.js - Obtaining Microsoft Graph Access Token with id_tokenADAL.js - 使用 id_token 获取 Microsoft Graph 访问令牌
【发布时间】:2017-06-28 12:44:21
【问题描述】:

我正在尝试将 Azure AD 登录和 Graph API 集成到我的 angular2 网站中。

我已成功实现 ADAL 登录和重定向,围绕有用的博文 here 构建

由此我检索到我的 adalservice 可以访问的 id_token 参数。目前这是通过一个简单的context.login() 并在重定向中捕获令牌来实现的。

当我使用此令牌尝试访问 Microsoft Graph 时,我收到一条 InvalidAuthenticationToken 响应,说明 Access Token validation failure

我是这个东西的新手,所以可能是我的调用本质上是错误的,或者我在 AD 中缺乏某些权限,或者我的应用程序注册缺乏权限。我已经看到我可能需要请求具有足够范围的访问令牌,但我可以找到这方面的任何示例。

有没有人使用这个 adalService 库来获取用于 Graph API 的令牌?

【问题讨论】:

  • 您能否提供您正在使用的范围以及您从初始令牌请求中返回的 JSON?
  • 这是相关的,并且可能是您正在寻找的另一种方法:stackoverflow.com/questions/42551153/…
  • @MarcLaFleur-MSFT 我的错误是没有调用 acquireToken 来获取图形 api 范围的令牌。我现在能够获得工作令牌并查询 API。谢谢
  • @JonnyKnottsvill,如果可能,请显示您的代码作为答案,这将帮助遇到同样问题的其他人。 id 令牌不能用于进行图形调用,观众验证将失败(显示您的错误),因为它应该是 https://graph.microsoft.com/。您可以使用 this.context.acquireToken("https://graph.microsoft.com/",function(message,token){} 获取图形 api 的访问令牌

标签: azure-active-directory microsoft-graph-api adal adal.js


【解决方案1】:

我找到了解决问题的方法。

我使用了错误的令牌。我必须专门为 Graph API 获取一个令牌。这意味着我必须先登录,然后调用this.context.acquireToken(),如下所示:

this.context.acquireToken("https://graph.microsoft.com", function (error, id_token) {

    if (error || !id_token) {
        console.log('ADAL error occurred: ' + error);
    } 
    else {
            this.graphAccessToken = id_token;
            //Call graph API
    }
    }.bind(this)
);

这个进程有 2 个调用似乎很重要。也许有人可以阐明我是否可以在登录时立即获得具有 Graph API 范围的令牌。也许通过在 Azure AD 中为应用设置所需的权限。

【讨论】:

  • 你发现了正确的模式! login() 将为您获取一个 id 令牌并“登录”用户,然后调用 acquireToken() 来获取资源的访问令牌是必不可少的。下一个版本的 adal.js 计划有一个重载的 acquireToken 可以执行交互式请求。这意味着您可以绕过登录调用!关注Github的发布。
  • 我知道这听起来可能很愚蠢,但我得到以下信息:错误:无法匹配任何路线。 URL 段:'access_token'。 if 条件返回“发生 ADAL 错误:令牌更新操作因超时而失败”。请问大家有什么建议吗?
  • 请发布您的完整解决方案。我认为我们需要回调以角度创建的“访问令牌”。 @AuroMetal 你能得到一些端到端的解决方案吗?
  • @NitinSingh 是的,我做到了!这是我自己的错,我忘了在路由中添加{ path: 'access_token', component: OAuthCallbackComponent, canActivate: [OAuthCallbackHandler] }
  • 这与添加到 'id_token' 路由的组件和保护相同,或者有点不同。 id_token 将在会话中设置用户配置文件,但这个应该有点不同。另外,你能正确调用graph api吗?通过 REST url 或一些图形包装器?如果您在此处发布您的解决方案作为答案会很好(因为要涵盖很多要点)
【解决方案2】:

只是为了让所有人都清楚,在这里再次更新端到端解决方案。

如果您没有基本入门代码,请参阅此链接Adal-JS Tutorial。这篇文章只涉及所涉及的定制。

第 1 步:配置 AdalService

(仅显示新代码,其他方法保持不变)

export class AdalService {

    public get graphAccessToken() {
        return  sessionStorage[new AppConstants().User_Graph_Token];
    }

    public retrieveTokenForGraphAPI() {
        this.context.acquireToken('https://graph.microsoft.com', function (error, graph_token) {

            if (error || !graph_token) {
                console.log('ADAL error occurred: ' + error);
            } else {
                // Store token in sessionStorage
                sessionStorage[new AppConstants().User_Graph_Token] = graph_token;
                return;
            }
        }.bind(this)
        );
    }
 }

代码应该有现有的 id_token 回调处理程序和路由中的相应配置。如果没有,请参考上面的链接获取初始代码。

现在要求是在检索到 id_token 后检索 access_token。 access_token 有“puid”的附加字段,它描述了声明的标识符。这将是第 2 步。

第 2 步:更新 LoginComponent

ngOnInit() {
    if (!this.adalService.isAuthenticated) {
      console.log('LoginComponent::Attempting login via adalService');
      this.adalService.login();
    } else {
      if (this.adalService.accessTokenForGraph == null) {
        console.log('LoginComponent::Login valid, attempting graph token retrieval');
        this.adalService.retrieveTokenForGraphAPI();
      }
   }

现在令牌被检索并存储以供以后使用。

第 3 步:更新“access_token”回调的路由

类似于 'id_token' 回调,我们需要为 access_token 添加额外的回调路由。回调组件将保持不变。他们的代码如主链接中所述。请注意,*access_token" 端点是 MS 提供的,因此请注意不要更改名称。

  { path: 'access_token', component:  OAuthCallbackComponent, canActivate: [OAuthCallbackHandler] },
  { path: 'id_token', component: OAuthCallbackComponent, canActivate: [OAuthCallbackHandler] }

第 4 步:在需要的地方使用令牌

const bearer = this.adalService.graphAccessToken();

【讨论】:

  • 抱歉回复晚了。这正是我所做的(包括完全相同的教程)! +1 以获得非常详细的答案。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-04-24
  • 1970-01-01
  • 1970-01-01
  • 2017-12-16
  • 2017-08-31
  • 2019-08-05
  • 1970-01-01
相关资源
最近更新 更多