LearningSky.io

【 Node.js 】透過 Azure Functions 探索 Azure Cosmos DB - 使用 Windows OS & Web UI

Archer -

內容

  • 學習目標
  • 前置準備作業
  • 程式與軟體
  • 設定 Azure Cosmos DB
  • 設定 Azure Functions
  • 透過 Postman 測試

學習目標

  • Integrating Serverless Architecture - 透過 Azure Functions 以 Node.js 操作 Azure Cosmos DB
  • 示意圖

前置準備作業

程式與軟體

  • Node.js
  • Postman

設定 Azure Cosmos DB

Step 1. 登入到 Azure

  • 網址為 https://portal.azure.com

Step 2. 建立 Azure Cosmos DB

  • 點選左邊 Azure Cosmos DB

  • 點選下方 Create Azure Cosmos DB account

  • 設定 Account 資訊

    • Resource Group 欄位請輸入唯一識別的名稱，可使用已存在的或新建一個資源群組

    • Account Name 欄位請輸入唯一識別的名稱

    • API 欄位請選擇 Core(SQL)

    • Location 欄位請選擇所要使用服務的所在地

    • 輸入完上方的資訊請點選下方的 Review + create

    • 點選下方的 Create

    • 建置過程

    • 建置完成

    • 點選下方 Go to resource

Step 3. 建立測試資料

  • 點選左側 Data Explorer

  • 點選上方 New Container

  • 輸入 Container 資訊

    • Database id 欄位請輸入 Company

    • Container id 欄位請輸入 Users

    • Partition key 欄位請輸入 /id

    • 點選右下角 OK

    • 點選 Users ➙ Items ➙ New Item

    • 分別建立 3 筆紀錄於下圖紅色框

      每輸入完 1 筆資訊後請點選上方的 Save 儲存資料

      • 第 1 筆

        {   "id": "1",   "name": "Archer",   "isEmployee": true }

      • 第 2 筆

        {   "id": "2",   "name": "Mosconi",   "isEmployee": false }

      • 第 3 筆

        {   "id": "3",   "name": "Eason",   "isEmployee": true }

    • 建立完成後的畫面

      • 3 筆資料會出現於紅色框

設定 Azure Functions

Step 1. 開啟 Azure Functions 服務

  • 在上方輸入框輸入 function app

  • 點選 Function App

Step 2. 相關 Function 程式說明

  • 所要建立的 Function 說明
Function Name Method Route Comment
GetAllUser Get /users 取得所有使用者
PostUser Post /user 新增 1 位使用者
UpdateUser Put /user/{id} 透過 id 來更新使用者
GetOneUser Get /user/{id} 透過 id 來取得使用者

Step 3. 建立 Function Apps 程式

  • 點選下方 Create Function App

  • 輸入 Function App 相關資訊

    • App name 欄位請輸入 cosmosdb-operate

    • Resource Group 欄位可以一個新的資源群組或使用存在的

    • OS 欄位請選擇 Windows，以使用 Web UI 進行編輯動作

    • Location 欄位請選擇所要使用何處的服務

    • Runtime Stack 欄位請選擇 Node.js

    • 當上方的資訊輸入完成後請點選下方的 Create

    • 建立完成畫面

    • 點選 cosmosdb-operate

Step 4. 建立 GetAllUser Function 程式

  • 說明

    Function Name Method Route Comment
    GetAllUser Get /users 取得所有使用者

  • 點選右方 New function

  • 點選 In-portal

  • 點選下方 Continue

  • 點選 More templates...

  • 點選 Finish and view templates

  • 點選 HTTP trigger

  • 輸入 Function 資訊

    • Name 欄位請輸入 GetAllUser

    • Authorization level 欄位選擇 Anonymous

    • 點選 Create

    • Create 完成畫面

    • 修改設定

      • 點選 Integrate

      • Trigger 部份

        • 選擇右上角 Advanced editor

          • methods 中只保留 get

          • 新增 , "route": "users"

          • 點選 Save

            存檔完成後請再次確認上步驟中的修改有成功

      • Inputs 部份

        • 點選 New Input

        • 點選 Azure Cosmos DB ➙ 點選 Select

        • 安裝 Cosmos Extension

        • 輸入 Cosmos 相關資訊

          • Database name 欄位輸入 Company

          • Collection Name 欄位輸入 Users

          • Azure Cosmos DB account connection 欄位點選 New ➙ 點選 Azure Cosmos DB account ➙ 點選 Select

        • 點選 Save

        • 設定完成畫面

    • 輸入 GetAllUser 程式碼

      • 點選左側 GetAllUser

      • 在紅色框處輸入下方程式

      • 點選 ► Save and run

      • 點選 </> Get function URL 取得連結

      • 線上測試

        • 點選右側 Test

        • 輸入相關資訊

          • HTTP method 欄位選擇 Get

          • 再點選 ► Run

          • 取得所有使用者資訊

Step 5. 建立 PostUser Function 程式

  • 說明

    Function Name Method Route Comment
    PostUser Post /user 新增 1 位使用者

  • 點選 Functions 右方的 +

  • 點選 HTTP trigger

  • 輸入 Function 資訊

    • Name 欄位請輸入 PostUser

    • Authorization level 欄位選擇 Anonymous

    • 點選 Create

    • Create 完成畫面

    • 修改設定

      • 點選 Integrate

      • Trigger 部份

        • 選擇右上角 Advanced editor

          • methods 中只保留 post

          • 新增 , "route": "user"

          • 點選 Save

            存檔完成後請再次確認上步驟中的修改有成功

      • Outputs 部份

        • 點選 + New Output

        • 點選 Azure Cosmos DB ➙ 點選 Select

        • 輸入 Cosmos 相關資訊

          • Database name 欄位輸入 Company

          • Collection Name 欄位輸入 Users

          • If true, creates the Azure Cosmos DB database and collection 欄位請勾選

        • 點選 Save

        • 設定完成畫面

    • 輸入 PostUser 程式碼

      • 點選左側 PostUser

      • 在紅色框處輸入下方程式

      • 點選 ► Save and run

      • 點選 </> Get function URL 取得連結

      • 線上測試

        • 點選右側 Test

        • 輸入相關資訊

          • HTTP method 欄位選擇 POST

          • Request body 欄位請輸入下方使用者資訊

            {     "id": "6",     "name": "test",     "isEmployee": false }

          • 再點選 ► Run

          • 寫入使用者資訊

            • 點選左側 Azure Cosmos DB

            • 點選所建立的名稱

            • 點選 Data Explorer

            • 點選 Users ➙ 點選 Items ➙ 6

Step 6. 建立 UpdateUser Function 程式

  • 說明

    Function Name Method Route Comment
    UpdateUser Put /user/{id} 透過 id 來更新使用者

  • 點選 Functions 右方的 +

  • 點選 HTTP trigger

  • 輸入 Function 資訊

    • Name 欄位請輸入 UpdateUser

    • Authorization level 欄位選擇 Anonymous

    • 點選 Create

    • Create 完成畫面

    • 修改設定

      • 點選 Integrate

      • Trigger 部份

        • 選擇右上角 Advanced editor

          • methods 中只保留 put

          • 新增 , "route": "user/{id}"

          • 點選 Save

            存檔完成後請再次確認上步驟中的修改有成功

      • Outputs 部份

        • 點選 + New Output

        • 點選 Azure Cosmos DB ➙ 點選 Select

        • 輸入 Cosmos DB 相關資訊

          • Database name 欄位輸入 Company

          • Collection Name 欄位輸入 Users

          • If true, creates the Azure Cosmos DB database and collection 欄位請勾選

        • 點選 Save

          存檔完成後請再次確認上步驟中的修改有成功

        • 設定完成畫面

      • Inputs 部份

        • 點選 + New Input

        • 點選 Azure Cosmos DB ➙ 點選 Select

        • 輸入 Cosmos DB 相關資訊

          • Database name 欄位輸入 Company

          • Collection Name 欄位輸入 Users

        • 點選 Save

          存檔完成後請再次確認上步驟中的修改有成功

        • 設定完成畫面

    • 輸入 UpdateUser 程式碼

      • 點選左側 UpdateUser

      • 在紅色框處輸入下方程式

      • 點選 ► Save and run

      • 點選 </> Get function URL 取得連結

      • 線上測試

        • 點選右側 Test

        • 輸入相關資訊

          • HTTP method 欄位選擇 PUT

          • id 欄位輸入 6

          • Request body 欄位請輸入下方使用者資訊

            {     "name": "test-from-azure-ui",     "isEmployee": true }

          • 再點選 ► Run

          • 寫入使用者資訊

            • 點選左側 Azure Cosmos DB

            • 點選所建立的名稱

            • 點選 Data Explorer

            • 點選 Users ➙ 點選 Items ➙ 6

Step 7. 建立 GetOneUser Function 程式

  • 說明

    Function Name Method Route Comment
    GetOneUser Get /user/{id} 透過 id 來取得使用者

  • 點選 Functions 右方的 +

  • 點選 HTTP trigger

  • 輸入 Function 資訊

    • Name 欄位請輸入 GetOneUser

    • Authorization level 欄位選擇 Anonymous

    • 點選 Create

    • Create 完成畫面

    • 修改設定

      • 點選 Integrate

      • Trigger 部份

        • 選擇右上角 Advanced editor

          • methods 中只保留 get

          • 新增 , "route": "user/{id}"

          • 點選 Save

            存檔完成後請再次確認上步驟中的修改有成功

      • Inputs 部份

        • 點選 New Input

        • 點選 Azure Cosmos DB ➙ 點選 Select

        • 輸入 Cosmos DB 相關資訊

          • Database name 欄位輸入 Company

          • Collection Name 欄位輸入 Users

        • 點選 Save

        • 設定完成畫面

    • 輸入 GetOneUser 程式碼

      • 點選左側 GetOneUser