共用方式為


調適型卡片範本服務

調適型卡片範本服務是一種概念證明服務,可讓任何人尋找、參與及共用一組已知的範本。

如果您想要顯示某些資料,但不想為它撰寫自訂調適型卡片,這非常有用。

請參閱此內容以取得調適型卡片範本化概觀

重要

條款與合約

Alpha 層級 服務會以「原狀」提供,且所有錯誤都不受支援。 來自服務的任何資料收集都受限於 Microsoft 隱私權聲明

這些功能目前為預覽版且隨時可能變更。 您的意見反應不僅歡迎使用,也請務必確保我們提供 您需要 的功能。

服務如何協助我?

假設我剛得到一段資料,可能是財務資料、Microsoft Graph資料、schema.org 資料,或來自我的組織內的自訂資料。

現在我想要向使用者顯示資料。

傳統上,這表示在提供給使用者的所有前端堆疊中撰寫自訂 UI 程式碼。

但是,如果我的應用程式根據資料類型來「學習」新的 UI 範本,該怎麼辦? 一個世界,任何人都可以參與、增強及共用通用 UI 範本、在其自己的專案內、組織內或整個網際網路。

什麼是卡片範本服務?

卡片範本服務是簡單的 REST 端點,可協助:

  • 藉由分析資料的結構來尋找範本
  • 取得 範本,讓您可以將它直接系結在用戶端上, 而不需要將資料傳送到伺服器或離開裝置
  • 用戶端資料系結不適合或可能時,填入伺服器上的範本

全部都後方為:

  • GitHub支援的共用開放原始碼範本存放庫。 (存放庫目前為私人,但在我們系結一些鬆散的結尾時,將會立即公開)
  • 所有範本都是存放庫中的一般 JSON 檔案,可讓編輯、參與和共用開發人員工作流程的自然部分。
  • 服務的程式碼將可供使用,因此您可以在最合理的地方裝載。

使用服務

取得所有範本

此端點會傳回所有已知範本的清單。

HTTP GET https://templates.adaptivecards.io/list

回應摘錄

{
  "graph.microsoft.com": {
    "templates": [
      {
        "file": "Files.json",
        "fullPath": "graph.microsoft.com/Files.json"
      },
      {
        "file": "Profile.json",
        "fullPath": "graph.microsoft.com/Profile.json"
      }
   ]
}

尋找範本

此端點會藉由分析資料的結構來嘗試尋找範本。

HTTP POST https://templates.adaptivecards.io/find

範例

假設我存取Microsoft Graph端點,以取得我的相關組織資料。

HTTP GET https://graph.microsoft.com/v1.0/me/

Graph Explorer screenshot

該 API 傳回 JSON 資料,但如何使用調適型卡片向使用者 顯示它

首先,我想要查看此資料類型的範本是否存在,因此我向 /find 端點提出 HTTP 要求,並在 中 POST body 輸入資料。

HTTP POST https://templates.adaptivecards.io/find

{
    "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
    "businessPhones": [
        "+1 412 555 0109"
    ],
    "displayName": "Megan Bowen",
    "givenName": "Megan",
    "jobTitle": "Auditor",
    "mail": "MeganB@M365x214355.onmicrosoft.com",
    "mobilePhone": null,
    "officeLocation": "12/1110",
    "preferredLanguage": "en-US",
    "surname": "Bowen",
    "userPrincipalName": "MeganB@M365x214355.onmicrosoft.com",
    "id": "48d31887-5fad-4d73-a9f5-3c356e68a038"
}

回應:

[
  {
    "templateUrl": "graph.microsoft.com/Profile.json",
    "confidence": 1
  }
]

此服務會傳回任何相符範本的清單,以及 confidence 指出相符專案有多接近的 。 現在可以使用該範本 URL 來 取得 範本,或 將其填 入伺服器端。

取得範本

從這個端點擷取的範本可以使用範本 化 SDK填入執行時間的資料。

HTTP GET https://templates.adaptivecards.io/[TEMPLATE-PATH]

您也可以在範本中包含「範例資料」,讓設計工具中的編輯變得更易記:

HTTP GET https://templates.adaptivecards.io/[TEMPLATE-PATH]?sampleData=true

範例

讓我們取得從上述傳 /find 回的 Microsoft Graph設定檔範本。

HTTP GET https://templates.adaptivecards.io/graph.microsoft.com/Profile.json

回應摘錄

{
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
    {
      "type": "TextBlock",
      "size": "Medium",
      "weight": "Bolder",
      "text": "{name}"
    },
    {
        // ...snip
    }
  ]
}

現在,使用此範本搭配範本 化 SDK 來建立現成轉譯調適型卡片。

填入範本伺服器端

在某些情況下,在用戶端上填入範本可能不合理。 針對這些使用案例,您可以讓服務傳回完整填入的調適型卡片,並準備好傳遞至任何調適型卡片轉譯器。

HTTP POST https://templates.adaptivecards.io/[TEMPLATE-PATH]

範例

讓我們填入從上述資料傳 /find 回的 Microsoft Graph設定檔範本。

HTTP POST https://templates.adaptivecards.io/graph.microsoft.com/Profile.json

{
    "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
    "businessPhones": [
        "+1 412 555 0109"
    ],
    "displayName": "Megan Bowen",
    "givenName": "Megan",
    "jobTitle": "Auditor",
    "mail": "MeganB@M365x214355.onmicrosoft.com",
    "mobilePhone": null,
    "officeLocation": "12/1110",
    "preferredLanguage": "en-US",
    "surname": "Bowen",
    "userPrincipalName": "MeganB@M365x214355.onmicrosoft.com",
    "id": "48d31887-5fad-4d73-a9f5-3c356e68a038"
}

回應摘錄

{
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
    {
      "type": "TextBlock",
      "size": "Medium",
      "weight": "Bolder",
      "text": "Megan Bowen"
    },
    {
        // ...snip
    }
  ]
}

請注意回應如何將第一個 TextBlock"Megan Bowen" 的文字取代為 ,而不是 "{name}" 在要求中 GET 。 此 AdaptiveCard 現在可以傳遞至任何調適型卡片轉譯器,而不需經過用戶端範本化。

參與範本

範本裝載于adaptivecards-templates存放庫中的GitHub上。

我們希望使用 GitHub 作為範本的備份存放區,我們可以「大眾化」撰寫、增強及共用範本的程式。 任何人都可以提交包含全新範本的提取要求,或對現有範本進行增強功能...全都在GitHub的開發人員易記體驗內。

自我裝載服務

並非所有資料類型都適用于裝載于 https://templates.adaptivecards.io 的「中央」調適型卡片範本服務。

我們想要確定任何人都可以在組織中裝載範本服務,因此原始程式碼可在GitHub上使用,而且可以輕鬆地部署到您自己的 Azure 函式。

➡ 在這裡開始adaptivecards-templates