Send Content – Chatbot Dojo https://v3.chatbotdojo.com Sun, 27 Sep 2020 22:21:35 +0000 en-US hourly 1 https://wordpress.org/?v=5.8.2 https://v3.chatbotdojo.com/wp-content/uploads/2020/07/favicon-56x56.png Send Content – Chatbot Dojo https://v3.chatbotdojo.com 32 32 How to send content with /fb/sending/sendContent https://v3.chatbotdojo.com/topic/how-to-send-content-with-fb-sending-sendcontent/ Mon, 21 Sep 2020 10:15:58 +0000 https://v3.chatbotdojo.com/?post_type=sfwd-topic&p=25276 How to send content with /fb/sending/sendContent Read More »

]]> Great! You’re here so that means you finished your Page Based API lessons. I hope they were clear to you and you already made some progress in testing them all out on your end.

Today we’re moving on to sending content using the send content API, instead of through the Manychat interface or chatbot in messenger.

Sending content

The curl command as displayed on the ManyChat API Swagger is:

curl -X POST "https://api.manychat.com/fb/sending/sendContent" -H "accept: application/json" -H "Content-Type: application/json" -d "{ \"subscriber_id\": 0, \"data\": {}, \"message_tag\": \"ACCOUNT_UPDATE\", \"otn_topic_name\": \"Сhannel news\"}"

If you look closely, you can see there are a few important variables in the command, such as the message_tag and the otn_topic_name.

The purpose of this API is to send your subscriber some content from anywhere other than the ManyChat interface.

Why would you need this?

A use case could be: sending your customer a message when an order is shipped, user credits to your program expire or reach a certain level etcetera.

The format for the content is this (obviously with sample message tag and topic name):

{
  "subscriber_id": 0,
  "data": {},
  "message_tag": "ACCOUNT_UPDATE",
  "otn_topic_name": "Сhannel news"
}

This is the default response on a successful request

{
  "status": "success"
}

How do we use this in our own system?

Let’s make this chapter into a sample use case of a SaaS platform for Job opportunities. We will create a form with the ability to send a user an update about his or her job application.

Let’s make some assumptions for this, e.g.:

  • the user has given us consent to send an update message about the job application (OTN: job application update)
  • we saved the user’s ManyChat ID in our system on its initial contact, so we can actually send a message

What do we need for this to work?

  • The API for sendContent
  • A JSON formatted message
  • An interface to change a status and send the message

First we will add a new function to our class file in classes/manychat.class.php.

    /**
     * 
     * @param type $json_message
     * @param type $mc_api
     */
    function sendContent($json_message, $mc_api = '123456:ABCDEF')
    {

        // initialize cURL
        $ch            = curl_init();
        curl_setopt($ch, CURLOPT_URL, "https://api.manychat.com/fb/sending/sendContent");
        curl_setopt($ch, CURLOPT_CUSTOMREQUEST, 'POST');
        curl_setopt($ch, CURLOPT_POST, true);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $json_message . PHP_EOL);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
        $headers       = [
            'Authorization: Bearer ' . preg_replace("/^(\w+\s+)/", "", $mc_api),
            'Accept: application/json',
            'Content-Type: application/json'
        ];
        curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
        // make the request
        $server_output = curl_exec($ch);
        curl_close($ch);
        
        $json_obj  = json_decode($server_output);
        $good_call = $json_obj->status;

        if ($good_call == "success") {
            return $json_obj;
        } else {
            return false;
        }
        
    }

The PHP/HTML file

Next we created an entire file with form fields, select inputs and a script to handle the Post request. The complete file is below. You can also keep it smaller by splitting the file, or even use jQuery/AJAX to submit your form. That is entirely up to you.

If you look closely in the code, you might notice something cool. I’ll quiz you later.

<!DOCTYPE html>
<html>
    <head>
        <title>Send Content</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <!--Bootstrap CSS--> 
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    </head>
    <body style="padding:50px;max-width:600px;">

        <?php
        /*
         * Load the ManyChat Config File
         */
        require_once './config.inc.php';

        /*
         * Create Page and Form
         */
        if (filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING)):

            /*
             * JSON Format  and POST method 
             */

            $json_arr = ["version" => "v2"];

            $content['messages'][] = [
                "type" => "text",
                "text" => "Hi, we have an update for your job application. Your status has been changed to: " . filter_input(INPUT_POST, 'sc_message')
            ];

            if (!empty(filter_input(INPUT_POST, 'next_flow_id'))) {
                $content['quick_replies'][] = [
                    "type"    => "flow",
                    "caption" => "Learn More >>",
                    "target"  => filter_input(INPUT_POST, 'next_flow_id')
                ];
            }

            // write content
            $json_arr['content'] = $content;

            //convert to json
            $json = json_encode($json_arr);

            // data to be posted
            $complete_message = [
                'subscriber_id'  => filter_input(INPUT_POST, 'mc_uid'),
                'data'           => $json,
                'message_tag'    => filter_input(INPUT_POST, 'message_tag'),
                "otn_topic_name" => filter_input(INPUT_POST, 'otn_topic_name')
            ];

            // encode json data or make string
            $json_message = json_encode($complete_message, JSON_PRETTY_PRINT);

            $sendContent = $mc->sendContent($json_message, $mc_api);

            if ($sendContent->status == "success") {
                echo "Your message is sent";
            } else {
                echo "We could not send your message";
            }

        else:
            ?>

            <form method="post" action="<?= $_SERVER["PHP_SELF"] ?>">
                
                
                <div class="form-group">
                    <label for="message_tag">User ID</label>                
                    <input type="text" class="form-control" value="123654789" id="mc_uid" name="mc_uid" />
                </div>

                <div class="form-group">
                    <label for="message_tag">Message Tag</label>
                    <select class="form-control" name="message_tag" id="message_tag">
                        <option value=''> -- Select a Tag -- </option>
                        <option value="ACCOUNT_UPDATE">ACCOUNT_UPDATE</option>
                        <option value="CONFIRMED_EVENT_UPDATE">CONFIRMED_EVENT_UPDATE</option>
                        <option value="POST_PURCHASE_UPDATE">POST_PURCHASE_UPDATE</option>
                        <option value="HUMAN_AGENT">HUMAN_AGENT</option>
                    </select>
                </div>

                <div class="form-group">  
                    <label for="otn_topic_name">OTN Topic</label>
                    <select class="form-control" name="otn_topic_name" id="otn_topic_name">
                        <option value=''> -- Select a Topic -- </option>
                        <?php
                        $page_otnTopics = $mc->getOtnTopics($mc_api);
                        foreach ($page_otnTopics AS $otnTopics) {
                            echo "<option value='$otnTopics->name'>$otnTopics->name</option>";
                        }
                        ?>
                    </select>
                </div>

                <div class="form-group">
                    <label for="next_flow_id">New Flow to Send User to (optional)</label>
                    <?php
                    $page_getFlows = json_decode($mc->getFlows($mc_api));
                    echo "<select name='next_flow_id' class='form-control'>";
                    echo "<option value=''> -- Select a Flow -- </option>";
                    foreach ($page_getFlows->flows AS $pageflows) {
                        echo "<option value='$pageflows->flowId'>$pageflows->flowName</option>";
                    }
                    echo "</select>";
                    ?>
                </div>

                <div class="form-group">
                    <label for="sc_message">Message Update Status</label>
                    <select class="form-control" name="sc_message" id="sc_message">
                        <option value="Interview Pending">Interview Pending</option>
                        <option value="Assessment Planned">Assessment Planned</option>
                        <option value="Rejected">Rejected</option>
                        <option value="Hired">Hired</option>
                    </select>
                </div>            

                <button type="submit" class="btn btn-primary">Send Content</button>

            </form>

        <?php
        endif;
        ?>        

        <!-- Optional JavaScript -->
        <!-- jQuery first, Bootstrap JS -->
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    </body>
</html>

The above page will look like this:

Did you check the code and noticed something? We actually used a few things you already studied in the Page API chapter. So you see how you implement things in real use cases already.

Let’s take a quiz.


How did you do? Wasn’t that cool, seeing a real thing you learned? If you came all this way, you’re already way ahead of so many other basic users. Great job!

If you have configured it all correctly, you can press the Submit button and the result will be the notice that your message was sent. Just enter your own ManyChat userID in there (normally this field will be a (hidden) field that is, for example, populated through your system) and send a message to yourself.

All that will be returned is this in your browser, and the configured message in your messenger.

I suggest you copy the files in this topic and do some tryouts and then move on to the next topic. See you there!

]]>