【 Cloud 】將 Node.js Express 部署到 Azure App Service 以取得 Azure Digital Twins Token
內容
- 學習目標
 - 前置準備作業
 - 建立 Azure App Service
 - 設定身分識別
 - 撰寫取得 Token 的程式
 - 部署程式到 Azure App Service
 - 透過 Postman 取得 Token
 - 透過 Postman 操作 Azure Digital Twins
 
學習目標
- 如何將 Node.js Express 部署到 Azure App Service 以取得 Azure Digital Twins Token
 
前置準備作業
- 已建立 Azure 帳號並能正常登入
 - 已於完成建立與設定 
Azure Digital Twins、Azure Active Directory ( Azure AD ) - 已於電腦端安裝 IDE,本範例使用 Visual Studio Code
 
建立 Azure App Service
Step 1. 登入到 Microsoft Azure
- 透過瀏覽器開啟 https://portal.azure.com/ 並登入
 
Step 2. 開啟 Azure App Service
- 在上方搜尋框輸入 
app services並點選下方App Services的搜尋結果 
Step 3. 建立 App Service
- 點選左上角的 
Create 
Step 4. 輸入 App 相關資訊
- 填寫資訊
- 在 
Subscription欄位請選擇所要使用哪個訂閱帳號 - 在 
Resource Group欄位請選擇使用舊有的或新建立一個新的 - 在 
Name欄位請輸入一個可識別的名稱- 本範例使用 
adtTest 
 - 本範例使用 
 - 在 
Runtime stack欄位請選擇Node 14 LTS - 在 
Operating System欄位請選擇Linux - 在 
Region欄位請選擇此服務所要建立於哪個資料中心 - 以上資訊輸入完成後請點選左下角的 
Review + create 
 - 在 
 
- 再次確認相關資訊後請按左下角的 
Create 
- 建立完成畫面並點選 
Go to resource 
Step 5. 取得 URL
設定身分識別
Step 1. 點選 Azure App Service 左側的 identity
Step 2. 將 Status 設成 On > 再點選 Save
Step 3. 再點選 Yes
Step 4. 點選 Azure role assignments
Step 5. 點選 + Add role assignment (Preview)
Step 6. 填寫相關資訊
Scope欄位請點選SubscriptionSubscription欄位請點選所要使用的訂閱Role欄位請選擇Azure Digital Twins Data Owner- 資料選取完成後再點選 
Save 
Step 7. 設定完成
撰寫取得 Token 的程式
Step 1. 初始化專案
- 執行下方指令
 
npm init -y
Step 2. 安裝套件
- 請在端終機輸入下方指令
 
npm i express cors dotenv @azure/identity
Step 3. 撰寫程式
- 在本地端電腦建立 
index.js的檔案再輸入下方程式 
部署程式到 Azure App Service
Step 1. 安裝 Azure App Service Extension 到 Visual Studio Code
Step 2. 登入到 Azure
- 點選 
Visual Studio Code左側的...> 再點選Azure 
- 點選 
Sign in to Azure... 
- 選擇登入 Azure 的帳號
 
- 登入成功
 
Step 3. 部署程式
- 點選 
> Azure in Open來展開已建立的 App Service 項目 
- 點選所建立的 App Service 右鍵 > 
Deploy to Web App... 
- 選擇專案目錄
 
- 點選 
Yes 
- 點選 
Deploy 
- 部署過程
 
- 部署完成
 
- 點選 
Browse Website 
- 顯示結果
 
透過 Postman 取得 Token
Step 1. 下載 Postman 並開啟 Postman
Step 2. 取得 Token
- 點選 
+ 
- 在 Enter Request URL 的輸入框輸入 
建立 Azure App Service段落的Step 5中所取得的 URL,並於後方再加上/getToken 
- 點選 
Send 
- 執行完成
- 複製 
token冒號後的值 
 - 複製 
 
透過 Postman 操作 Azure Digital Twins
Models - DigitalTwinModels List
Step 1. 設定 Request URL
- 點選 
+ 
- 在 
Enter Request URL的輸入框輸入https://Host-Name/models?api-version=2020-10-31- ㊟ 將 
Host-Name修改成所建立的Azure Digital Twins中的Host name 
 - ㊟ 將 
 
Step 2. 設定 Authorization Header
- 點選 
Headers頁籤 
- 輸入相關資訊
- 在 
KEY欄位輸入Authorization - 在 
VALUE欄位輸入Bearer再加上透過 Postman 取得 Token段落所取得的Token- ㊟ 
Bearer須加上一個空白 
 - ㊟ 
 
 - 在 
 
Step 3. 執行
- 點選 
Send 
- 執行結果