共用方式為


整合 Azure 函式

簡介

本教學課程提供如何設定 Azure 函式以接收使用者相關資訊的詳細指引。 強烈建議設定 Azure 函式。 這有助於避免在 Contoso 應用程式中使用硬式編碼應用程式參數 (例如使用者識別碼和使用者權杖)。 這些信息是高度機密的。 更重要的是,我們會在後端定期刷新用戶令牌。 硬编码使用者 ID 和 token 組合需要在每次重新整理後編輯值。

先決條件

開始之前,請務必:

  • 建立具有有效訂閱的 Azure 帳戶。 如需詳細資訊,請參閱免費建立帳戶
  • 安裝 Visual Studio Code。

設定函數

  1. 在 Visual Studio Code 中安裝 Azure 函式延伸模組。 您可以從 Visual Studio Code 的外掛瀏覽器或透過此連結安裝它。
  2. 請遵循 此連結來設定本機 Azure 函式應用程式。 我們需要在JavaScript中使用HTTP觸發器範本來建立一個本機函數。
  3. 安裝 Azure 通訊服務程式庫。 我們將使用身分識別程式庫來產生使用者存取權杖。 在本機 Azure 函式應用程式目錄中執行 npm install 命令,以安裝適用於 JavaScript 的 Azure 通訊服務身分識別 SDK。
    npm install @azure/communication-identity --save
  1. 修改檔案 index.js ,使其看起來像以下程式碼:
    const { CommunicationIdentityClient } = require('@azure/communication-identity');
    const connectionString = '<your_connection_string>'
    const acsEndpoint = "<your_ACS_endpoint>"
    
    module.exports = async function (context, req) {
        let tokenClient = new CommunicationIdentityClient(connectionString);
    
        const userIDHolder = await tokenClient.createUser();
        const userId = userIDHolder.communicationUserId
    
        const userToken = await (await tokenClient.getToken(userIDHolder, ["chat"])).token;
    
        context.res = {
            body: {
                acsEndpoint,
                userId,
                userToken
            }
        };
    }

上述程式碼的說明:第一行會匯入 CommunicationIdentityClient 的介面。 您可以在 Azure 入口網站的 Azure 通訊服務資源中找到第二行中的連接字串。 ACSEndpoint 是所建立的 Azure 通訊服務資源的 URL。

  1. 在 Visual Studio Code 中開啟本機 Azure 函式資料夾。 開啟 index.js 並執行本機 Azure 函式。 本機 Azure 函式端點將會在終端機中建立並輸出。 列印的訊息看起來類似:
Functions:
HttpTrigger1: [GET,POST] http://localhost:7071/api/HttpTrigger1

在瀏覽器中開啟連結。 結果將類似於以下示例:

    {
      "acsEndpoint": "<Azure Function endpoint>",
      "userId": "8:acs:a636364c-c565-435d-9818-95247f8a1471_00000014-f43f-b90f-9f3b-8e3a0d00c5d9",
      "userToken": "eyJhbGciOiJSUzI1NiIsImtpZCI6IjEwNiIsIng1dCI6Im9QMWFxQnlfR3hZU3pSaXhuQ25zdE5PU2p2cyIsInR5cCI6IkpXVCJ9.eyJza3lwZWlkIjoiYWNzOmE2MzYzNjRjLWM1NjUtNDM1ZC05ODE4LTk1MjQ3ZjhhMTQ3MV8wMDAwMDAxNC1mNDNmLWI5MGYtOWYzYi04ZTNhMGQwMGM1ZDkiLCJzY3AiOjE3OTIsImNzaSI6IjE2Njc4NjI3NjIiLCJleHAiOjE2Njc5NDkxNjIsImFjc1Njb3BlIjoiY2hhdCIsInJlc291cmNlSWQiOiJhNjM2MzY0Yy1jNTY1LTQzNWQtOTgxOC05NTI0N2Y4YTE0NzEiLCJyZXNvdXJjZUxvY2F0aW9uIjoidW5pdGVkc3RhdGVzIiwiaWF0IjoxNjY3ODYyNzYyfQ.t-WpaUUmLJaD0V2vgn3M5EKdJUQ_JnR2jnBUZq3J0zMADTnFss6TNHMIQ-Zvsumwy14T1rpw-1FMjR-zz2icxo_mcTEM6hG77gHzEgMR4ClGuE1uRN7O4-326ql5MDixczFeIvIG8s9kAeJQl8N9YjulvRkGS_JZaqMs2T8Mu7qzdIOiXxxlmcl0HeplxLaW59ICF_M4VPgUYFb4PWMRqLXWjKyQ_WhiaDC3FvhpE_Bdb5U1eQXDw793V1_CRyx9jMuOB8Ao7DzqLBQEhgNN3A9jfEvIE3gdwafpBWlQEdw-Uuf2p1_xzvr0Akf3ziWUsVXb9pxNlQQCc19ztl3MIQ"
    }
  1. 將本機功能部署至雲端。 如需詳細資訊,請參閱 此文件

  2. 測試已部署的 Azure 函式。 首先,在 Azure 入口網站中尋找您的 Azure 函式。 然後,使用 [取得函式 URL] 按鈕來取得 Azure 函式端點。 您看到的結果應該與步驟 5 中顯示的結果類似。 Azure 函式端點將會在應用程式中用於初始化應用程式參數。

  3. Implement UserTokenClient,可用來呼叫目標 Azure 函式資源,並從傳回的 JSON 物件取得 Azure 通訊服務端點、使用者識別碼和使用者權杖。 請參閱範例應用程式以瞭解使用方式。

疑難排解指南

  1. 如果 Azure 函式延伸模組無法將本機函式部署至 Azure 雲端,可能是因為 Visual Studio Code 版本和所使用的 Azure 函式延伸模組有錯誤。 此版本組合已經過測試,可運作:Visual Studio Code 版本 1.68.1 和 Azure 函式延伸模組版本 1.2.1
  2. 初始化應用程式常數的位置很棘手,但很重要。 再次查看聊天 Android 快速入門。 更具體來說,請查看「設定應用程式常數」一節中的醒目提示附註,並與您所取用版本的範例應用程式進行比較。

(選擇性) 保護 Azure 函式端點

為了示範目的,此範例預設會使用可公開存取的端點來擷取 Azure 通訊服務權杖。 在生產案例中,其中一個選項是使用您自己的安全端點來佈建您自己的權杖。

透過額外的設定,此範例支援連線到 Microsoft Entra 受保護的端點,讓應用程式需要使用者記錄才能擷取 Azure 通訊服務權杖。 用戶將需要使用 Microsoft 帳戶登錄才能訪問該應用程序。 此設定可提高使用者需要登入時的安全層級。 根據使用案例決定是否啟用它。

請注意,我們目前不支援範例程式碼中的 Microsoft Entra ID。 請遵循下列連結,在您的應用程式和 Azure 函式中啟用它:

在 Microsoft Entra ID 下註冊您的應用程式 (使用 Android 平台設定)。

設定您的 App Service 或 Azure Functions 應用程式,以使用 Microsoft Entra ID 登入