Facebook Messenger机器人：如何在登录按钮中添加图片？

你好呀～ 作为Messenger机器人开发新手，你遇到的这个问题其实是模板类型的选择问题：你当前用的**按钮模板（Button Template）本身并不支持直接添加图片，要实现「图片+登录按钮」的组合，得换成通用模板（Generic Template）**才行，这个模板专门用来展示带图片、文本、按钮的卡片式内容。

为什么原来的按钮模板不行？ #

你提到的image_url属性并不属于按钮模板的结构范畴，按钮模板的payload只有template_type、text、buttons这几个核心字段，没有预留放置图片的位置，所以直接往里加image_url是不会生效的。

修改后的代码示例 #

下面是调整后的完整代码，我把结构改成了通用模板，你可以直接参考：

if (received_message.text) {
  response = {
    "attachment": {
      "type": "template",
      "payload": {
        "template_type": "generic",
        "elements": [
          {
            "image_url": "https://你的图片地址.com/xxx.jpg", // 这里填入你的图片URL
            "text": "my_text",
            "buttons": [
              {
                "type": "account_link",
                "url": "my_link.com/login"
              }
            ]
          }
        ]
      }
    }
  };
}

关键部分解释 #

• 把template_type从button改成generic，这是切换到通用模板的核心操作
• 在elements数组里定义卡片内容：每个数组元素对应一张卡片，你可以在里面添加image_url、text，以及你的登录按钮
• elements是数组结构，如果你需要展示多张卡片，可以继续往数组里添加元素；如果只需要一张，像上面这样保留一个元素就够了

这样发送出去的消息就是一张带图片、文本和登录按钮的卡片，完全符合你的需求啦～

内容的提问来源于stack exchange，提问作者Roger Ventura