使用 React-AAD-MSAL 查找 Azure/AD 組

Question

我已將 React-Aad-MSAL 客戶端的基本身份驗證集成到我的 react-app 中，這使我能夠成功獲取用戶名和 email 等信息。 在一個組件中，我想在顯示一些數據之前檢查用戶組。

import React, { useContext } from 'react'
import { observer } from 'mobx-react-lite'
import { Container, Header } from 'semantic-ui-react';
import {
    AzureAD,
    AuthenticationState,
    IAzureADFunctionProps
  } from "react-aad-msal";
import { authProvider } from '../../../app/auth/authProvider';
import { RootStoreContext } from '../../../app/stores/rootStore';

const PurchasePipelineDashboard: React.FC = () => {
    const rootStore = useContext(RootStoreContext)
    const {
        idTokenClaimsAction } = rootStore.serverCatalogStore;

    return (
        // <Container style={{marginTop:'7em'}}>
        //     <Header content="Purchase Pipeline" />
        // </Container>
        <AzureAD provider={authProvider} >
        {({
          accountInfo,
          authenticationState,
          error
        }: IAzureADFunctionProps) => {
          return (
            <React.Fragment>
              {authenticationState === AuthenticationState.Unauthenticated && (
                  <h1>Oooo weee!</h1>
              )}
            </React.Fragment>
          );

        }}
      </AzureAD>
    )   
}

export default observer(PurchasePipelineDashboard);

我的問題是； 我 go 如何收集用戶所在的組？ 我檢查了 accountInfo.account.idTokenClaims，但沒有一個返回令牌。 我看到其他使用 Graph 的教程，但我真的需要這兩個庫嗎？ 任何幫助將不勝感激！

Answer 1

您在這里有兩個選項，您可以按照此處將它們添加到令牌中的聲明中： https：//learn.microsoft.com/en-us/azure/active-directory/develop/active-directory-optional-claims #configuring-groups-optional-claims但有一些限制，例如它最多只能返回 150-200 個組。

或者您可以調用單獨的圖形 api 來獲取用戶組。 下面是一個如何用 react 調用 graph 的例子https://github.com/microsoftgraph/msgraph-training-reactspa

您將為此查看圖形的 getmembergroups 端點： https://learn.microsoft.com/en-us/graph/api/user-getmembergroups?view=graph-rest-1.0&tabs=http