通过Graph API发送的自适应卡片messageBack按钮PC端失效，移动端正常

问题现象 #

通过Graph API发送带有messageBack按钮的缩略卡片，卡片在移动端和PC端均能正常显示，但点击按钮时，移动端可正常触发消息发送，PC端无任何响应。

请求详情 #

使用Graph Explorer发送请求，地址：https://graph.microsoft.com/v1.0/chats/{channel-id}/messages

请求体如下：

{
    "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\": \"This is an example of posting a card\",\r\n  \"subtitle\": \"<h3>This is the subtitle</h3>\",\r\n  \"text\": \"Here is some body text. <br>\\r\\nAnd a <a href=\\\"http://microsoft.com/\\\">hyperlink</a>. <br>\\r\\nAnd below that is some buttons:\",\r\n  \"buttons\": [\r\n    {\r\n      \"type\": \"messageBack\",\r\n      \"title\": \"Login to FakeBot\",\r\n      \"text\": \"login\",\r\n      \"displayText\": \"login\",\r\n      \"value\": \"login\"\r\n    }\r\n  ]\r\n}",
            "name": null,
            "thumbnailUrl": null
        }
    ]
}

解决方案 #

问题根源在于使用的缩略卡片（application/vnd.microsoft.card.thumbnail）对messageBack按钮的支持在Teams PC端存在兼容性问题，建议替换为自适应卡片，并通过Action.Submit实现相同交互逻辑。

修改后的请求体示例：

{
    "subject": null,
    "body": {
        "contentType": "html",
        "content": "<attachment id=\"74d20c7f34aa4a7fb74e2b30004247c5\"></attachment>"
    },
    "attachments": [
        {
            "id": "74d20c7f34aa4a7fb74e2b30004247c5",
            "contentType": "application/vnd.microsoft.card.adaptive",
            "contentUrl": null,
            "content": "{\r\n  \"type\": \"AdaptiveCard\",\r\n  \"version\": \"1.0\",\r\n  \"body\": [\r\n    {\r\n      \"type\": \"TextBlock\",\r\n      \"size\": \"Large\",\r\n      \"text\": \"This is an example of posting a card\"\r\n    },\r\n    {\r\n      \"type\": \"TextBlock\",\r\n      \"size\": \"Medium\",\r\n      \"text\": \"This is the subtitle\"\r\n    },\r\n    {\r\n      \"type\": \"TextBlock\",\r\n      \"text\": \"Here is some body text. \\nAnd a hyperlink. \\nAnd below that is some buttons:\"\r\n    }\r\n  ],\r\n  \"actions\": [\r\n    {\r\n      \"type\": \"Action.Submit\",\r\n      \"title\": \"Login to FakeBot\",\r\n      \"data\": {\r\n        \"text\": \"login\",\r\n        \"value\": \"login\"\r\n      },\r\n      \"displayText\": \"login\"\r\n    }\r\n  ]\r\n}",
            "name": null,
            "thumbnailUrl": null
        }
    ]
}

关键修改点 #

1. 将卡片contentType改为application/vnd.microsoft.card.adaptive
2. 按照自适应卡片规范重构内容，用Action.Submit替代messageBack按钮
3. 按钮交互数据存入data字段，确保两端都能正确识别并触发响应

内容的提问来源于stack exchange，提问作者Kilian Moreau