"image_aspect_ratio" flag not respected while sharing from Messenger BOT webview

Question

I'm trying to make a share from the webview of my bot. Here's my code

var messageToShare = {
            "attachment":{
              "type":"template",
              "payload":{
                "template_type":"generic",
                "image_aspect_ratio":"square",
                "elements":[
                   {
                    "title":"Welcome to Peter\'s Hats",
                    "subtitle":"We\'ve got the right hat for everyone.",
                    "image_url":"https://pbs.twimg.com/profile_images/735453447718338561/9W-MTtOo_400x400.jpg",
                    "buttons":[
                      {
                        "type":"web_url",
                        "url": "my share url",
                        "title":"View Website"
                      }
                    ]
                  }
                ]
              }
            }
        }
MessengerExtensions.beginShareFlow(
  function success() {},
  function error(errorCode, errorMessage) {},
  messageToShare,
  "broadcast"
);

The share is working, but it's not posting the image as expected. The "image_aspect_ratio" flag is not respected and the image is displayed with horizontal layout.

But the same JSON displays the image as a square when the share is done thru CURL. Is there something wrong with my share object ? Please help

score 1 · Accepted Answer · answered Oct 21 '17 at 07:20

1

It was a bug on Messenger platform. I reported about it to Facebook and now it has beed fixed. https://developers.facebook.com/bugs/391245647960177/

answered Oct 21 '17 at 07:20

ykensuke9

714
2
7
15

score 0 · Answer 2 · edited Sep 26 '17 at 15:14

You need to add "sharable":true in your payload:

var messageToShare = {
  "attachment":{
    "type":"template",
    "payload":{
      "template_type":"generic",
      "image_aspect_ratio":"square",
      "sharable": true,
      "elements":[
         {
          "title":"Welcome to Peter\'s Hats",
          "subtitle":"We\'ve got the right hat for everyone.",
          "image_url":"https://pbs.twimg.com/profile_images/735453447718338561/9W-MTtOo_400x400.jpg",
          "buttons":[
            {
              "type":"web_url",
              "url": "my share url",
              "title":"View Website"
            }
          ]
        }
      ]
    }
  }
}

"image_aspect_ratio" flag not respected while sharing from Messenger BOT webview

2 Answers2