快速入門：使用 MSAL Node 以從 Node.js Web 應用程式來登入使用者並呼叫 Microsoft Graph API - Microsoft identity platform

文章
07/03/2024

在本快速入門中，您會下載並執行程式碼範例，該範例會示範 Node.js Web 應用程式如何使用授權碼流程登入使用者。此程式碼範例也會示範如何取得存取權杖以呼叫 Microsoft Graph API。

如需圖例，請參閱此範例的運作方式。

本快速入門會使用適用於 Node.js 的 Microsoft 驗證程式庫 (MSAL Node) 與授權碼流程。

必要條件

Azure 訂用帳戶。免費建立 Azure 訂用帳戶。
Node.js
Visual Studio Code 或其他程式碼編輯器

註冊並下載快速入門應用程式

步驟 1：註冊您的應用程式

提示

根據您開始使用的入口網站，本文中的步驟可能略有不同。

以至少雲端應用程式系統管理員的身分登入 Microsoft Entra 系統管理中心。
若有權存取多個租用戶，請使用頂端功能表中的 [設定] 圖示，以從 [目錄 + 訂用帳戶] 功能表中切換至您想要在其中註冊應用程式的租用戶。
瀏覽至 [身分識別] > [應用程式] > [應用程式註冊]，然後選取 [新增註冊]。
輸入應用程式的名稱。您的應用程式使用者可能會看到此名稱，而且您稍後可以加以變更。
在 [支援的帳戶類型] 底下，選取 [僅在此組織目錄中的帳戶]。
將 [重新導向 URI] 類型設定為 [Web]，並將值設定為 http://localhost:3000/auth/redirect。
選取註冊。
在應用程式 [概觀] 頁面上，記下 [應用程式 (用戶端) 識別碼] 值以供稍後使用。
在 [管理] 下方，選取 [憑證和祕密] > [用戶端密碼] > [新增用戶端密碼]。將描述和預設到期日留白，然後選取 [新增]。
請記下 [用戶端密碼] 的值，以供後續使用。

步驟 2：下載專案

若要使用 Node.js 搭配網頁伺服器來執行專案，請下載核心專案檔。

步驟 3：設定您的 Node 應用程式

將專案解壓縮，開啟 ms-identity-node-main 資料夾，然後開啟應用程式資料夾下的 .env 檔案。取代上述的值，如下所示：

變數	描述	範例
`Enter_the_Cloud_Instance_Id_Here`	註冊應用程式所在的 Azure 雲端執行個體	`https://login.microsoftonline.com/` (包含向前頃斜線)
`Enter_the_Tenant_Info_here`	租用戶識別碼或主要網域	`contoso.microsoft.com` 或 `aaaabbbb-0000-cccc-1111-dddd2222eeee`
`Enter_the_Application_Id_Here`	所註冊應用程式的用戶端識別碼	`00001111-aaaa-2222-bbbb-3333cccc4444`
`Enter_the_Client_Secret_Here`	所註冊應用程式的用戶端密碼	`A1b-C2d_E3f.H4i,J5k?L6m!N7o-P8q_R9s.T0u`
`Enter_the_Graph_Endpoint_Here`	您的應用程式將呼叫的 Microsoft Graph API 雲端執行個體	`https://graph.microsoft.com/` (包含向前頃斜線)
`Enter_the_Express_Session_Secret_Here`	用來簽署 Express 工作階段 Cookie 的隨機字元字串	`A1b-C2d_E3f.H4...`

您的檔案應類似於下方所示：

CLOUD_INSTANCE=https://login.microsoftonline.com/
TENANT_ID=aaaabbbb-0000-cccc-1111-dddd2222eeee
CLIENT_ID=00001111-aaaa-2222-bbbb-3333cccc4444
CLIENT_SECRET=A1b-C2d_E3f.H4...

REDIRECT_URI=http://localhost:3000/auth/redirect
POST_LOGOUT_REDIRECT_URI=http://localhost:3000

GRAPH_API_ENDPOINT=https://graph.microsoft.com/

EXPRESS_SESSION_SECRET=6DP6v09eLiW7f1E65B8k

步驟 4：執行專案

使用 Node.js 執行專案。

若要啟動伺服器，請從專案目錄執行下列命令：
```
cd App
npm install
npm start
```
移至 http://localhost:3000/。
選取 [登入] 以啟動登入程序。

第一次登入時，系統會提示您同意允許應用程式登入和存取您的設定檔。成功登入之後，系統會將您重新導向回應用程式首頁。

其他相關資訊

此範例的運作方式

此範例會在 localhost 連接埠 3000 上裝載 Web 伺服器。當網頁瀏覽器存取此位址時，應用程式會轉譯首頁。使用者選取 [登入] 之後，應用程式會透過 MSAL 節點程式庫所產生的 URL，以將瀏覽器重新導向至 Microsoft Entra 登入畫面。使用者同意之後，瀏覽器會將使用者重新導向回應用程式首頁並提供識別碼和存取權仗。

MSAL 節點

MSAL Node 程式庫會登入使用者並要求權杖，該權杖是用來存取受 Microsoft 身分識別平台保護的 API。您可以利用 Node.js 套件管理員 (npm) 下載最新版本：

npm install @azure/msal-node

下一步

若要深入了解，請在下列多部分教學課程系列中建置可登入使用者的 ASP.NET Core Web 應用程式：

教學課程：可登入使用者的 Web 應用程式

分享方式：