ADAL.js-使用id_token获取Microsoft Graph Access令牌 [英] ADAL.js - Obtaining Microsoft Graph Access Token with id_token
问题描述
我正在尝试将Azure AD登录名和Graph API集成到我的angular2网站中.
I am attempting to integrate Azure AD login and Graph API into my angular2 website.
我已经成功实现了ADAL登录和重定向,它围绕着一个有用的博客文章
I have successfully implemented an ADAL login and redirect, built around a useful blog post here
由此我检索了adalservice可以访问的id_token参数.目前,这是通过简单的context.login()
并在重定向中捕获令牌来实现的.
From this I retrieved an id_token parameter that my adalservice can access. Currently this is acheived through a simple context.login()
and catching the token in the redirect.
当我使用此令牌尝试访问Microsoft Graph时,收到一个InvalidAuthenticationToken
响应,指出Access Token validation failure
.
When I use this token to try and access Microsoft Graph, I receive an InvalidAuthenticationToken
response stating Access Token validation failure
.
我是新手,所以可能是我的电话本来是错误的,或者我在AD中缺少某些权限,或者我的应用程序注册表缺少权限.我已经看到我可能需要请求具有足够范围的访问令牌,但是我可以找到任何此类示例.
I'm new to this stuff, so it could be that my call is intrinsically wrong, or that I lack certain permissions in AD, or my app reg lacks permissions. I've seen that I potentially need to request an access token with sufficient scope, yet I can find any examples of this.
有人使用过此adalService库来获取用于Graph API的令牌吗?
Has anyone used this adalService library to obtain tokens for use with Graph API?
推荐答案
只是为了所有人都清楚起见,请在此处再次更新端到端解决方案.
Just to have a clarity for all, updating the end to end solution here again.
In case you do not have the base starter code, refer to this link Adal-JS Tutorial. This post only concerns with the customization involved.
第1步:配置AdalService
(仅显示新代码,其他方法保持不变)
(only new code is shown, other methods remain as it is)
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回调的现有处理程序以及路由中的相应配置.如果没有,请参考上面的链接获取初始代码.
The code should have existing handlers for id_token callback and corresponding configuration in the routing. If not, please refer to link above for the initial code.
现在,一旦检索到 id_token ,就需要检索 access_token . access_token具有用于"puid"的附加字段,该字段描述声明的标识符.这将是第2步.
Now the requirement is retrieve the access_token once the id_token is retrieved. The access_token has additional field for "puid" which describes identifier for claims. This will be the step 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();
}
}
现在,令牌已被检索并存储以供以后使用.
Now the token is retrieved and stored for later use.
第3步:更新"access_token"回调的路由
类似于'id_token'回调,我们需要为access_token添加其他回调路由.回调组件将保持不变.它们的代码如主链接中所述.请注意,* access_token端点是MS提供的,因此请注意不要更改名称.
Similar to the 'id_token' callback, we need to add additional callback route for the access_token. The callback components will remain same. Their code is as described in the main link. Note that *access_token" endpoint is MS provided, hence be careful not to change the name.
{ path: 'access_token', component: OAuthCallbackComponent, canActivate: [OAuthCallbackHandler] },
{ path: 'id_token', component: OAuthCallbackComponent, canActivate: [OAuthCallbackHandler] }
第4步:在需要的地方使用令牌
const bearer = this.adalService.graphAccessToken();
这篇关于ADAL.js-使用id_token获取Microsoft Graph Access令牌的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!