# JSON API for Messenger

**JSON API** is an advanced component providing powerful flexibility and functionality. With JSON API, you can connect your bot to a backend service, completing a highly flexible responses.

You can make many kinds of HTTP requests for your bot to analyze your backend and make the appropriate responses.

To be specific, you can run:

1. Create dynamic messages
2. Execute “postbacks”
3. Obtain and set up user arguments (coming soon)
4. Redirecting to other messages (coming soon)

### Response reference:

We will parse the JSON response and send a message to the customer based on the response. For more information, please visit  <https://developers.facebook.com/docs/messenger-platform/reference/send-api/>

### Sending Text&#x20;

The response below will be sent as text messages.

```
{
  "messages": [
    { "text": "Welcome to the smartest bot building tool ever —— YOCTOL.AI" },
    { "text": "what kind of bot do you want  to build?" }
  ]
}
```

### **Sending Image**&#x20;

Image formats of JPG, PNG and GIF are supported as messages from JSON requests.

```
{
  "messages": [
    {
      "attachment": {
        "type": "image",
        "payload": {
          "url": "https://yoctol.ai/images/logo.svg"
        }
      }
    }
  ]
}
```

You can also send out messages of Facebook pictures so you won’t need to upload the image again.

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "media",
          "elements": [
            {
              "media_type": "image",
              "url": "https://www.facebook.com/Yoctol/photos/2200581453590553",
              "buttons": [
                {
                  "title": "Yoctol Website",
                  "type": "web_url",
                  "url": "https://www.yoctol.com/"
                }
              ]
            }
          ]
        }
      },
      "quick_replies": [
        {
          "content_type": "text",
          "title": "Join Yoctol!",
          "payload": <TEXT PAYLOAD>
```

### **Sending Video**&#x20;

The following response is an example of using a video as message. Currently, Messenger only supports MP4 files with size less than 25MB.

```
{
  "messages": [
    {
      "attachment": {
        "type": "video",
        "payload": {
          "url": "https://ytstatic.blob.core.windows.net/yoctol-ai-website/landing-page.mp4"
        }
      }
    }
  ]
}
```

You can also use existing Facebook video posts as messages!

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "media",
          "elements": [
            {
              "media_type": "video",
              "url": "https://www.facebook.com/Yoctol/videos/1733376656977704/",
              "buttons": [
                {
                  "title": "Yoctol Website",
                  "type": "web_url",
                  "url": "https://www.yoctol.com/"
                }
              ]
            }
          ]
        }
      },
      "quick_replies": [
        {
          "content_type": "text",
          "title": "That's cool!",
          "payload": <TEXT PAYLOAD>
        }
      ]
    }
  ]
  }
```

### **Sending Voice Memos**&#x20;

The following response will send a voice memo file. Currently, Messenger only supports memo files under 25MB of size with extensions of MP3, OCG, and WAV.

```
{
  "messages": [
    {
      "attachment": {
        "type": "audio",
        "payload": {
          "url": "https://ccrma.stanford.edu/~jos/mp3/bachfugue.mp3"
        }
      }
    }
  ]
}
```

### **Sending Files**

The following response will prompt a file as message. Messenger at the moment only supports files under 25MB with no restricted file type.

```
{
  "messages": [
    {
      "attachment": {
        "type": "file",
        "payload": {
          "url": "http://www.africau.edu/images/default/sample.pdf"
        }
      }
    }
  ]
}
```

### **Sending Carousels**

The following response will create a carousel message. Please note that every element of the carousel includes an image, a description, and a button.

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "generic",
          "image_aspect_ratio": "square",
          "elements": [
            {
              "title": "Yoctol Image 1",
              "image_url": "https://www.yoctol.com/images/amazingBrain.png",
              "subtitle": "Size: M",
              "buttons": [
                {
                  "type": "web_url",
                  "url": "https://www.yoctol.com",
                  "title": "View Item"
                }
               ]
            },
            {
              "title": "Yoctol Image 2",
              "image_url": "https://www.yoctol.com/images/amazingBrain.png",
              "subtitle": "Size: L",
              "default_action": {
                "type": "web_url",
                "url": "https://www.yoctol.com",
              },
              "buttons": [
                {
                  "type": "web_url",
                  "url": "https://www.yoctol.com",
                  "title": "View Item"
                }
              ]
            }
          ]
        }
      }
    }
  ]
}
```

### **Sending List Templates**

The following response will return a list template message. For more information, visit <https://developers.facebook.com/docs/messenger-platform/send-messages/template/list/>

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "list",
          "top_element_style": "large",
          "elements": [
            {
              "title": "Yoctol List Image 1",
              "image_url": "https://www.yoctol.com/images/amazingBrain.png",
              "subtitle": "Size: M",
              "buttons": [
                {
                  "type": "web_url",
                  "url": "https://www.yoctol.com",
                  "title": "Go to shop"
                }
              ]
            },
            {
              "title": "Yoctol List Image 2",
              "image_url": "https://www.yoctol.com/images/amazingBrain.png",
              "subtitle": "Size: L",
              "default_action": {
                "type": "web_url",
                "url": "https://www.yoctol.com",
                },
              "buttons": [
                {
                  "type": "web_url",
                  "url": "https://www.yoctol.com",
                  "title": "Go to shop"
                }
              ]
            }
          ]
        }
      }
    }
  ]
}
```

### **Sending Buttons**

The following response will send a button template. You can manually set up the actions for each button, for example prompting to another website. For more usages of buttons, visit <https://developers.facebook.com/docs/messenger-platform/send-messages/buttons>

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "button",
          "text": "Hello!",
          "buttons": [
            {
              "type": "web_url",
              "url": "https://www.yoctol.com",
              "title": "Go to website"
            }
          ]
        }
      }
    }
  ]
}
```

You can also send special buttons for actions, such as dialing a number.

```
{
  "messages": [
    {
      "attachment": {
        "type": "template",
        "payload": {
          "template_type": "generic",
          "elements": [
            {
              "title": "Learn More",
              "image_url": "https://www.yoctol.com/images/amazingBrain.png",
              "subtitle": "You can directly contact us! If you like our service, help us to share it to others!",
              "buttons": [
                {
                  "type": "phone_number",
                  "phone_number": "+886223222168",
                  "title": "Contact service agent"
                },
                {
                  "type": "element_share"
                }
              ]
            }
          ]
        }
      }
    }
  ]
}
```

### **Sending Quick Reply**&#x20;

The following response provides a text with quick reply buttons.

```
{
  "messages": [
    {
      "text": "Did you enjoy the last game of the CF Rockets?",
      "quick_replies": [
        {
          "content_type": "text",
          "title": "Loved it!",
          "payload": <TEXT PAYLOAD>
        }
      ]
    }
  ]
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs-en.yoctol.ai/advanced-settings/json-api-for-messenger.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
