使用開發人員帳戶在本機開發期間向 Azure 服務驗證 JavaScript 應用程式

  • 發行項

當您建立雲端應用程式時，開發人員必須在其本機工作站上偵錯及測試應用程式。 當應用程式在本機開發期間於開發人員的工作站上執行時，仍必須向應用程式使用的任何 Azure 服務進行驗證。 本文涵蓋如何使用開發人員的 Azure 認證，在本機開發期間向 Azure 驗證應用程式。

此圖顯示從 .env 檔案取得服務主體，並使用該身分識別連線到 Azure 資源的本機開發應用程式。

若要讓應用程式在使用開發人員的 Azure 認證進行本機開發期間向 Azure 進行驗證，開發人員必須從 Visual Studio Code Azure Tools 擴充功能、Azure CLI 或 Azure PowerShell 登入 Azure。 Azure SDK for JavaScript 能夠偵測開發人員已從其中一個工具登入，然後從認證快取取得必要的認證，以以登入使用者身分向 Azure 驗證應用程式。

這種方法對開發小組而言最容易設定，因為使用的是開發人員現有 Azure 帳戶。 不過，開發人員帳戶的許可權可能會超過應用程式所需的許可權，因此超過應用程式在生產環境中執行的許可權。 或者，您可以建立應用程式服務主體以在本機開發期間使用，其範圍可限定為只有應用程式所需的存取權。

1 - 建立 Microsoft Entra 群組以進行本機開發

由於幾乎一律有多個開發人員在應用程式上工作，因此建議您先建立 Microsoft Entra 群組，以封裝應用程式在本機開發中所需的角色（許可權）。 這具有以下優點。

  • 由於角色是在群組層級指派，因此指派給每位開發人員的角色都能保證相同。
  • 如果應用程式需要新的角色，它只需要新增至應用程式的 Microsoft Entra 群組。
  • 如果新的開發人員加入小組，他們只需要新增至正確的 Microsoft Entra 群組，以取得正確的許可權來處理應用程式。

如果您有開發小組的現有 Microsoft Entra 群組，您可以使用該群組。 否則，請完成下列步驟以建立 Microsoft Entra 群組。

指示 Screenshot
在頁面頂端的搜尋方塊中輸入 Microsoft Entra ID，然後從服務底下選取 Microsoft Entra ID，以流覽至 Azure 入口網站 中的 Microsoft Entra 標識符頁面。 顯示如何使用 Azure 入口網站 頂端搜尋列來搜尋並流覽至 Microsoft Entra ID 頁面的螢幕快照。
在 [ Microsoft Entra 標識符 ] 頁面上，從左側功能表中選取 [群組 ]。 顯示 Microsoft Entra ID 預設目錄頁面左側選單中 [群組] 選單項位置的螢幕快照。
在 [所有群組] 頁面中，選取 [新增群組]。 顯示 [所有群組] 頁面中 [新增群組] 按鈕位置的螢幕快照。
在 [新增群組] 頁面進行下列設定：
  1. 群組類型 → 安全性。
  2. [群組名稱] → 安全性群組的名稱，通常從應用程式名稱建立。 在群組名稱中包含類似 local-dev 的字串也很有説明，以指出群組的目的。
  3. [群組描述] → 群組用途的描述。
  4. 選取 [成員] 下方的 [未選取任何成員] 連結，為群組新增成員。
 顯示如何建立新 Microsoft Entra 群組的螢幕快照。要選取以新增成員至此群組的連結位置會反白顯示。
在 [新增成員] 對話方塊進行下列設定：
  1. 使用搜尋方塊篩選清單中的使用者名稱清單。
  2. 為此應用程式選擇一或多個用戶進行本機開發。 當您選擇物件時，物件會移至對話框底部的 [ 選取的專案 ] 清單。
  3. 完成後，請選擇 [ 選取] 按鈕。
 [新增成員] 對話框的螢幕快照，其中顯示如何選取要包含在群組中的開發人員帳戶。
回到 [新增群組] 頁面，選取 [建立] 以建立群組。

群組隨即建立，而您會回到 [所有群組] 頁面。 群組最多可能需 30 秒才會顯示，且礙於 Azure 入口網站中的快取，您可能必須重新整理頁面才能看見。		 [新增群組] 頁面的螢幕快照，其中顯示如何選取 [建立] 按鈕來完成程式。

2 - 將角色指派給 Microsoft Entra 群組

接著，您必須決定應用程式針對哪些資源需要哪些角色 (權限)，並將這些角色指派給應用程式。 在此範例中，角色會指派給步驟 1 中建立的 Microsoft Entra 群組。 角色可在資源、資源群組或訂閱範圍內獲派其他角色。 此範例示範如何在資源群組範圍中指派角色，因為大部分的應用程式都會將其所有 Azure 資源群組組成單一資源群組。

指示 Screenshot
用 Azure 入口網站頂端的搜尋方塊，搜尋資源群組的名稱，藉此找出應用程式的資源群組。

選取對話方塊中 資源群組 標題下方的資源群組名稱，瀏覽至您的資源群組。		 此螢幕快照顯示如何使用 Azure 入口網站 中的頂端搜尋方塊來尋找並流覽至您要指派角色的資源群組（許可權）。
在資源群組分頁中，從左側功能表選取 存取控制 (IAM)。 資源群組頁面的螢幕快照，其中顯示訪問控制 （IAM） 功能表項的位置。
在 存取控制 (IAM) 分頁上：
  1. 選取 [角色指派] 索引標籤。
  2. 從頂端功能表選取 [+ 新增]，然後從產生的下拉功能表中選取 [新增角色指派]。
 此螢幕快照顯示如何流覽至 [角色指派] 索引標籤，以及用來將角色指派新增至資源群組的按鈕位置。
新增角色指派 分頁列出所有可指派至資源群組之角色的清單。
  1. 請善用搜尋方塊，將清單篩選為更易於管理的大小。 此範例顯示如何針對儲存體 Blob 角色進行篩選。
  2. 選取您要指派的角色。
    選取 [下一步] 前往下一個畫面。
 顯示如何篩選和選取要新增至資源群組的角色指派的螢幕快照。
下一個 新增角色指派 分頁能讓您指定要指派角色的使用者。
  1. 選取 [存取權指派對象為] 下的 [使用者、群組或服務主體]。
  2. 選取 [成員] 下的 [+ 選取成員]
對話框會在 Azure 入口網站 右側開啟。		 此螢幕快照顯示要選取將角色指派給 Microsoft Entra 群組的單選按鈕，以及用來選取要指派角色之群組的連結。
在 [選取成員] 對話方塊進行下列設定：
  1. [選取] 文字輸入框可用來篩選訂閱中的使用者及群組清單。 如有需要，請輸入您為應用程式建立之本機開發 Microsoft Entra 群組的前幾個字元。
  2. 選取與您應用程式相關聯的本機開發 Microsoft Entra 群組。
選取對話方塊底部的 [選取] 來繼續。		 螢幕快照，顯示如何在 [選取成員] 對話框中篩選及選取應用程式的 Microsoft Entra 群組。
Microsoft Entra 群組會在 [ 新增角色指派 ] 畫面上顯示為已選取。

選取 [檢閱 + 指派] 移至最終分頁，然後再次選取 [檢閱 + 指派] 完成此流程。		 此螢幕快照顯示已完成的 [新增角色指派] 頁面，以及用來完成程式之 [檢閱 + 指派] 按鈕的位置。

3 - 使用 VS Code、Azure CLI 或 Azure PowerShell 登入 Azure

在開發人員工作站上開啟終端，然後從 Azure PowerShell 登入 Azure。

Connect-AzAccount

4 - 在應用程式中實作 DefaultAzureCredential

若要向 Azure 驗證 Azure SDK 用戶端物件，您的應用程式應該使用 DefaultAzureCredential 套件中的 @azure/identity 類別。 在此案例中， DefaultAzureCredential 會循序檢查開發人員是否已使用 VS Code Azure 工具擴充功能、Azure CLI 或 Azure PowerShell 登入 Azure。 如果開發人員使用任何這些工具登入 Azure，則應用程式會使用用來登入工具的認證向 Azure 進行驗證。

首先，將 @azure/身分 識別套件新增至您的應用程式。

npm install @azure/identity

接下來，針對在應用程式中建立 Azure SDK 用戶端物件的任何 JavaScript 程式代碼，您會想要：

  1. 從模組匯入 DefaultAzureCredential@azure/identity 類別。
  2. 建立 DefaultAzureCredential 物件。
  3. 將 DefaultAzureCredential 對象傳遞至 Azure SDK 用戶端物件建構函式。

下列程式碼區段示範其中一種範例。

import { BlobServiceClient } from '@azure/storage-blob';
import { DefaultAzureCredential } from '@azure/identity';

// Acquire a credential object
const tokenCredential = DefaultAzureCredential();

const blobServiceClient = BlobServiceClient(
        `https://${accountName}.blob.core.windows.net`,
        tokenCredential
);

DefaultAzureCredential 會自動偵測為應用程式設定的驗證機制，並取得向 Azure 驗證應用程式所需的令牌。 如果應用程式使用多個SDK用戶端，則相同的認證物件可以與每個SDK客戶端物件搭配使用。