0

我在登录页面上使用与此示例microsoft-authentication-library-for-js相同的 msal 身份验证。登录后，我将重定向到具有人员选择器组件的页面。该组件代码如下所示。我的前端客户端是 React。我正在将 NPM 包"@microsoft/mgt": "^1.3.0-preview.2"用于人员选择器和"msal": "^1.3.0"登录用户

import React, { useState, useRef } from 'react';


import '@microsoft/mgt';

const PeoplePicker = props => {

      // reference to access mgt-people-picker on DOM
      const peoplePicker = useRef();

      return (
         <div>
            <mgt-msal-provider client-id={process.env.REACT_APP_DEV_AZURE_APP_CLIENT_ID} />
            <mgt-people-picker ref={peoplePicker} />
         </div>
      )

}

当我开始输入人员选择器时，没有从我们的组织 AD 中获取任何人员列表。我检查了控制台中的网络选项卡，在您输入此输入时没有进行网络调用。它没有抛出错误，所以我假设 Provider 正在工作，但它可能是会话或令牌附加到人员选择器的问题，尽管我不完全确定我将如何做到这一点。

在此处输入图像描述

我浏览了微软文档、github问题等，但也没有帮助

4

1 回答 1

0

类似于这里的答案：https ://stackoverflow.com/a/62024758/13040450

由于 react 处理自定义元素的方式，它们必须以不同的方式引用。或者，您可以在此处使用我们的包装器：

https://github.com/nmetulev/mgt-react

这将允许您通过以下方式引用组件：

import { PeoplePicker } from 'mgt-react';
<PeoplePicker ></PeoplePicker >

快速说明：React 组件的名称采用 PascalCase 格式，不包含 Mgt 前缀

另一个注意事项：mgt-react 处于预览阶段，尚未经过全面测试或记录。请查看并留意未来的 V1：https ://github.com/nmetulev/mgt-react

于 2020-05-29T17:02:38.473 回答