Wit.ai - sending pictures via Facebook Messenger Send API

Question

I need my Wit.ai chat bot to respond to certain messages with images, and since I've refactored my code to match the latest messenger example in the node-wit SDK I can't figure out how to do so.

Previously this FB message function worked for me:

var newMessage = function (recipientId, msg, atts, cb) {
    var opts = {
        form: {
            recipient: {
                id: recipientId
            },
        }
    }

    if (atts) {
        var message = {
            attachment: {
                "type": "image",
                "payload": {
                    "url": msg
                }
            }
        }
    } else {
        var message = {
            text: msg
        }
    }
    opts.form.message = message

    newRequest(opts, function (err, resp, data) {
        if (cb) {
            cb(err || data.error && data.error.message, data)
        }
    })
}

Now I've updated to the node-wit SDK messenger example:

const fbMessage = (id, text) => {
     const body = JSON.stringify({
     recipient: { id },
     message: { text },
     });
    const qs = 'access_token=' + encodeURIComponent(FB_PAGE_TOKEN);
    return fetch('https://graph.facebook.com/me/messages?' + qs, {
         method: 'POST',
         headers: {'Content-Type': 'application/json'},
         body,
    })
    .then(rsp => rsp.json())
    .then(json => {
         if (json.error && json.error.message) {
              throw new Error(json.error.message);
         }
    return json;
    });
};

Which I've modified like this to try and make image replies work:

const fbMessage = (id, text, atts) => {

    if (atts) {
        var body = {
            attachment: {
                "type": "image",
                "payload": {
                    "url": { text }
                }
            },
        };
    } else {
        var body = JSON.stringify({
            recipient: { id },
            message: { text },
        });
    }
    const qs = 'access_token=' + encodeURIComponent(FB_PAGE_TOKEN);
    return fetch('https://graph.facebook.com/me/messages?' + qs, {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body,
    })
    .then(rsp => rsp.json())
    .then(json => {
        if (json.error && json.error.message) {
            throw new Error(json.error.message);
        }
        return json;
    });
};

Text messages are being sent as normal, but when I try to send an image attachment, my image url references are just being sent as strings.

The FB Messenger Send API reference is here

Any help would be greatly appreciated!

wanstan · Answer 1 · 2016-09-16T06:47:10.253

Got it working with this:

const fbMessage = (id, text) => {

    var x = text.substring(0,4);

    if (x == 'http') {
        var body = JSON.stringify({
            recipient: { id },
            message: {
                attachment: {
                    "type": "image",
                    "payload": {
                        "url": text
                    }
                }
            },
    });

    } else {
        var body = JSON.stringify({
            recipient: { id },
            message: { text },
        });
    }

    const qs = 'access_token=' + encodeURIComponent(FB_PAGE_TOKEN);
    return fetch('https://graph.facebook.com/me/messages?' + qs, {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body,
    })
    .then(rsp => rsp.json())
    .then(json => {
        if (json.error && json.error.message) {
            throw new Error(json.error.message);
        }
        return json;
     });
};

*NB - This obviously won't work if you plan on sending text replies that are just urls i.e. 'http://example.com'. To get around this you can put any symbol in front of the url address in your message like so: '> http://example.com' and links will work fine.

Wit.ai - sending pictures via Facebook Messenger Send API

1 Answers1