MS Graph with Teams [One-a-one chat]: A button card message that calls an thyrd-party API

Question

Hello everyone,

I need a help with one question, I will really appreciate any response, I am trying to search by how to do it too much time, and I didn't find a way.

I am building an integration with MS Teams by MS Graph API. From a thyrd-party system I am calling MS Graph endpoints aiming to send card messages in one-a-one chats on MS Teams by API, I had totally success with it, but I am stucked in Adaptive Cards button actions.

I'm trying to build a button that calls an thyrd-party API, do you know if is it possible? For an example, build a button that when the user click in it, do a REST Post operation to the url https://abc.com.br with the header Authentication populated with some value and additionally, any info that allows me to search by the message, like the chat ID.

I am building all of it first in Postman, so that example must to work completely here, without any relationships with Teams Apps, bots or any other thing that is not related to MS Graph APIs, I really need a solution that I can made first, completely on Postman by Rest calls.

I'm sending below the call I built, where I failed to build the action button because I have no idea how to make it.

Additionally, I attached here a view from my actual card visual/render.

############################# ACTUAL OPERATION

Operation: POST

URL: https://graph.microsoft.com/v1.0/chats/{chatid}/messages

Body with mocked data:
{
"subject": null,
"body": {
"contentType": "html",
"content": "<attachment id=\"74d20c7f34aa4a7fb74e2b30004247c5\"></attachment>"
},
"attachments": [
{
"id": "74d20c7f34aa4a7fb74e2b30004247c5",
"contentType": "application/vnd.microsoft.card.thumbnail",
"contentUrl": null,
"content": "{\r\n \"title\": \"Aprovação da Requisição REQ000012231\",\r\n \"subtitle\": \"<h3>Aprovar ou rejeitar aprovação</h3>\",\r\n \"text\": \"Olá identificamos o pedido REQ00001321 de Cláudio pendente de sua aprovação. <br>\nPor favor <a href=\\"https://helix-dwp.intraservice.corp/dwp/app/#/catalog\\">clique aqui</a> para acessar o portal de serviços e realizar a sua aprovação. <br>\n Ou utilize os botões de ação abaixo:\",\r\n \"buttons\": [\r\n {\r\n \"type\": \"messageBack\",\r\n \"title\": \"Aprovar\",\r\n \"text\": \"login\",\r\n \"displayText\": \"login\",\r\n \"value\": \"login\"\r\n },\r\n{\r\n \"type\": \"Action.Submit\",\r\n \"title\": \"Aprovares\",\r\n \"data\":\r\n {\"msteams\":\r\n {\r\n \"type\":\"signin\",\r\n \"value\":\"https://google.com.br\",\r\n },\r\n \"extraData\":\"(this will be ignored)\"\r\n}\r\n},{\r\n \"type\": \"messageBack\",\r\n \"title\": \"Rejeitar\",\r\n \"text\": \"login\",\r\n \"displayText\": \"login\",\r\n \"value\": \"login\"\r\n }],\r\n\"actions\":\r\n[\r\n{\r\n\"type\": \"Action.ShowCard\",\r\n\"title\": \"Set due date\",\r\n\"card\":\r\n{\r\n\"type\":\"AdaptiveCard\",\"version\": \"1.0\",\r\n\"body\":\r\n[\r\n{\r\n\"type\": \"Input.Date\",\r\n\"id\": \"dueDate\"\r\n}\r\n],\r\n\"actions\":\r\n[\r\n{\r\n\"type\": \"Action.Submit\",\r\n\"title\": \"OK\"\r\n}\r\n]\r\n}\r\n}\r\n}",
"name": null,
"thumbnailUrl": null
}
]
}

Answer 1

Microsoft Teams does not support making POST requests from clicks on Adaptive Cards.

Answer 2

You can't set headers, so I suggest you attach the authentication header as a query string parameter and make ur server understand that. Other option is to redirect them to authenticate in browser. Ideally you want second because that way your link does not contain authorizing information.

Answer 3

I will try to follow your suggested, but first I need to know how to build the button.

Do you have any example of the JSON code of a button that do a REST Post operation to a third-party system?

Answer 4

Oh, ok, thanks!