0
votes

I am new to api.ai and I was doing the webhook implementation. I've noticed that only the "speech" or "displayText" from webhook response is shown to the user. Is there any technique to use any other params from the response?

I would be glad, if anyone tell me how could I format the response text like making it bold, change font etc.

Thank you!

1

1 Answers

2
votes

Note that if the client you are sending the response to (such as Facebook Messenger) does not support special formats such as bold, this is an exercise in futility.

That said, there are many richer types of responses you can send than just plain text, and if you want to do this programmatically rather than build rich responses in API.ai, I'd suggest injecting your custom server side solution between the client and API.ai rather than have it at the end of the process.

In other words: Client interface <-> Custom solution <-> API.ai rather than Client <-> API.ai <-> Custom fulfillment

This gives you more customization and fulfillment options, including building entirely custom response/prompt logic without even hitting the API.ai endpoint, or further editing API returns after they are processed, for example appending a database query result to the text of an API.ai fulfillment.

Assuming you have a setup like this, in node.js a solution for sending more advanced payloads than text to Facebook Messenger would look like this:

//Send gif or image reply
function sendGifMessage(recipientId) {
	var messageData = {
		recipient: {
			id: recipientId
		},
		message: {
			attachment: {
				type: "image",
				payload: {
					url: config.SERVER_URL + "FILE LOCATION"
				}
			}
		}
	};

	callSendAPI(messageData);
}

// Send custom payload buttons
function sendButtonMessage(recipientId, text, buttons) {
	var messageData = {
		recipient: {
			id: recipientId
		},
		message: {
			attachment: {
				type: "template",
				payload: {
					template_type: "button",
					text: text,
					buttons: buttons
				}
			}
		}
	};

	callSendAPI(messageData);
}

// Send quickReply buttons
function sendQuickReply(recipientId, text, replies, metadata) {
	var messageData = {
		recipient: {
			id: recipientId
		},
		message: {
			text: text,
			metadata: isDefined(metadata)?metadata:'',
			quick_replies: replies
		}
	};

	callSendAPI(messageData);
}

function callSendAPI(messageData) {
	request({
		uri: 'https://graph.facebook.com/v2.6/me/messages',
		qs: {
			access_token: config.FB_PAGE_TOKEN
		},
		method: 'POST',
		json: messageData

	}, function (error, response, body) {
		if (!error && response.statusCode == 200) {
			var recipientId = body.recipient_id;
			var messageId = body.message_id;

			if (messageId) {
				console.log("Successfully sent message with id %s to recipient %s",
					messageId, recipientId);
			} else {
				console.log("Successfully called Send API for recipient %s",
					recipientId);
			}
		} else {
			console.error("Failed calling Send API", response.statusCode, response.statusMessage, body.error);
		}
	});
}

Hope that helps