什麼是Teams Tabs

Tabs是微軟Teams的一種十分有用的擴充套件方式。可以非常方便的和現有的網站或者網頁應用進行整合。具體的說明不在這裡展開了。可以閱讀微軟官方的詳細說明：

• https://docs.microsoft.com/en-gb/microsoftteams/platform/concepts/tabs/tabs-overview

準備工作

因為開發一個Tabs涉及到的方面比較多，我在本地dotnet裡新增一個Teams的模板，讓開發更加簡單

c:\demo> dotnet new -i MicrosoftTeams.Templates

另外，Tabs裡內嵌的是一個網頁應用，我們將使用目前流行的React框架，所以我們還需要nodeJS

NodeJS

步驟

• 下載 ngrok
• 執行ngrok.exe http 5000。因為我們專案啟動會監聽 5000 埠.

• 拷貝 ngrok 的 url (注意是：https). 

• 執行dotnet new teamstabs命令生成專案。

• 開啟 manifest.json 檔案, 將相關 url 替換為上一步拷貝的 url。 

• 將 manifest.json、icon-outline.png 和 icon-color.png 三個檔案打包為 manifest.zip. 這個 zip 包就是我們要上傳到 teams 的應用包。

  

• 執行以下命令.

  1. dotnet build

  2. dotnet run

• 開啟 Microsoft Teams, 建立一個 Tab.

  1. 找到某個 team 並進入，導航到’Apps’標籤頁.
  2. 點選頁面右下角的’Upload a custom app’(上傳自定義應用)按鈕.
  3. 選擇並上傳剛才的壓縮包 manifest.zip. 
• 點選剛才上傳的”MSTeamsTab”應用並且為需要的Channel進行設定。 

現在，你就可以在你Team的Channel裡看到這個Tab，點選此Tab後就能看到我們的頁面了。