如何使用Azure AD获取用户配置文件详细信息

时间:2020-07-24 11:29:55

标签: reactjs azure-active-directory microsoft-graph-api

我正在使用react-aad-masl模块将Microsoft SSO集成到我的react应用程序中。我可以将用户重定向到Microsoft登录页面,然后用令牌返回到我的页面。之后,它仅返回包含用户名和电子邮件ID的accountInfo。我需要获取用户其他详细信息,例如ID,名字,姓氏,组等。

这些所有详细信息都将通过此Azure AD MASL发出,或者我需要进行Graph API调用?

下面是我的实现

// authProvider.js

import { MsalAuthProvider, LoginType } from 'react-aad-msal';
import { Logger, LogLevel } from "msal";

// Msal Configurations
const config = {
  auth: {
    authority: 'https://login.microsoftonline.com/*********',
    clientId: '*************',
    redirectUri: 'http://localhost:3000/'
  },
  // Enable logging of MSAL events for easier troubleshooting.
  // This should be disabled in production builds.
  system: {
    logger: new Logger(
      (logLevel, message, containsPii) => {
        console.log("[MSAL]", message);
      },
      {
        level: LogLevel.Verbose,
        piiLoggingEnabled: false
      }
    )
  },
  cache: {
    cacheLocation: "sessionStorage",
    storeAuthStateInCookie: true
  }
};
 
// Authentication Parameters
const authenticationParameters = {
  scopes: [
    'user.read',
    'profile',
    'openid'
    //'profile.read', 
    // 'User.Read.All',
    // 'Group.Read.All',
    // 'User.ReadBasic.All',
    // 'Group.Read'
  ]
}
 
// Options
const options = {
  loginType: LoginType.Redirect,
  tokenRefreshUri: window.location.origin + '/auth.html'
}
 
export const authProvider = new MsalAuthProvider(config, authenticationParameters, options)

// APP.js

<AzureAD provider={authProvider}  forceLogin={false}>
      {(abc) => {
          console.log('>>>>>>>>>>>>...', abc);
          
          props.setAccountInfo(abc.accountInfo.account);
          return <AppRouter />
      }}
      </AzureAD>

在abc中,我正在获取以下信息

enter image description here

请帮助我

1 个答案:

答案 0 :(得分:0)

您需要在应用程序令牌配置中为名字,姓氏配置可选声明。

enter image description here

请仔细查看documentation

关于团体信息,请检查此document