练习 - 将 JavaScript 应用连接到 Microsoft 365

12 分钟

在本练习中，你将创建一个连接到 Microsoft 365 的 JavaScript 应用。你将使用 Microsoft 身份验证库 JavaScript 库来允许用户使用他们的 Microsoft 365 帐户登录到你的应用。然后将使用 Microsoft Graph JavaScript SDK 显示他们的名称。

运行应用

要获取本练习中使用的初始应用代码，请选择以下选项之一：

如果使用 Git，请通过使用 git clone 命令克隆项目：
```
git clone https://github.com/MicrosoftDocs/mslearn-retrieve-m365-data-with-msgraph-quickstart.git
```
如果不使用 Git，请在 Web 浏览器中转到 https://github.com/MicrosoftDocs/mslearn-retrieve-m365-data-with-msgraph-quickstart。依次选择代码按钮、下载 ZIP。将 zip 文件提取到计算机。
在代码编辑器中打开文件夹。
打开 auth.js 文件并找到常量 msalConfig：
```
const msalConfig = {
    auth: { .. }
}
```
将属性的值 clientId 替换为之前注册的 Microsoft Entra 应用程序中复制 的应用程序 (客户端) ID 值， (spa-aad-app) 。可以从 Microsoft Entra 应用程序的概述页获取此值， (spa-aad-app) 。
在同 一auth.js 文件中，找到 msalConfig.auth.authority 属性。将 <your directory ID here> 值替换为之前注册的 Microsoft Entra 应用程序的 Directory (租户) ID 值， (spa-aad-app) 。可以从 Microsoft Entra 应用程序的概述页获取此值， (spa-aad-app) 。

该 msalConfig 常量应类似于以下代码，其中包含来自 Microsoft Entra 租户和已注册应用程序的唯一 ID：
```
const msalConfig = {
  auth: {
    clientId: 'b1a37248-53b5-430c-b946-ef83521af70c',
    authority: 'https://login.microsoftonline.com/b930540b-a147-45bb-8f24-bfbed091aa25',
    redirectUri: 'http://localhost:8080'
  }
};
```
在终端中执行以下命令来预览该 Web 应用：
```
npm start
```
应打开默认浏览器并指向 http://localhost:8080。
选择“使用 Microsoft 登录”按钮，以使用 Microsoft 365 帐户登录。
使用帐户登录并同意应用后，应该看到应用显示用户名。
通过在终端窗口中选择 CTRL+C 来停止 Node.js 服务器。

继续

练习 - 将 JavaScript 应用连接到 Microsoft 365

运行应用

反馈