Dialogflow is a chatbot building framework that helps you build and deploy your own chatbots to multiple platforms like Google Assistant, Facebook Messenger, Telegram, Twitter, Slack, Line, Viber and many others. It is powered by a Machine Learning based NLU (Natural Language Understanding). The feature rich Dialogflow lets you create chatbot with ease.
In this blog, we are going to take a look into one pretty useful feature of Dialogflow: Fulfillment. Using Fulfillment you can communicate with your server/database to generate dynamic responses. In Fulfillment, we develop a webhook on our server which accepts request from Dialogflow, process the request and respond with Dialogflow compatible JSON.
Let’s dig deeper into webhook to understand how it works and what are the benefits a chatbot developer can leverage using it.
A webhook is a user defined HTTP callback that is automatically invoked whenever certain criteria is fulfilled. A webhook can be created in any server side programming language like Python, PHP or Node.js. You can read more about webhook here.
In Dialogflow, a webhook can be used to fetch data from your server whenever a certain intent having webhook enabled (don’t worry, we will see that) is invoked. The information from the intent is passed to the webhook service to receive result.
We are going to use Ngrok, (a web tunneling tool) that can be used to call webhook from your local server. You can download Ngrok from ngrok.io.
Let’s start building our own Dialogflow agent with webhook using Python (Flask) and deploy it using Ngrok.
Download and install python from here as per your supported OS.
Flask is a lightweight web framework that can be used to create webhook service which can communicate with external application (in our case Dialogflow’s agent). To use flask in our app, first we need to install it. It can be easily installed using “pip”. If “pip” is not installed then you will need to install it first.
pip install Flask
For more information you can visit: https://pypi.org/project/Flask
Let’s create a basic flask app.
# import flask dependencies
from flask import Flask
# initialize the flask app
app = Flask(__name__)
# default route
@app.route('/')
def index():
return 'Hello World!'
# create a route for webhook
@app.route('/webhook')
def webhook():
return 'Hello World!'
# run the app
if __name__ == '__main__':
app.run()
Now, run the app using the following command.
python app.py or FLASK_APP=hello.py flask run
Our basic app is working now, but as it is on local system it can not be accessed from outside world. To integrate it as webhook for Dialogflow, we need to make it live/online. For that, we use ngrok.
Ngrok is a web tunnelling tool that provides a way to test APIs and webhooks from local server. There are two versions available. I am using the free version with registration on ngrok.io.
To run ngrok, use the following command: ngrok http <port_number>
e.g. ngrok http 5000 (for flask app)
Dialogflow provides an option on the left sidebar known as Fulfillment. Just enter your webhook url generated by ngrok and your are done.
Be sure to add the URL with /webhook like https://836b69cc.ngrok.io/webhook and not just https://836b69cc.ngrok.io/ as we are going to handle the request on /webhook route not the index route.
If you provide URL without webhook then you may get error like “Webhook call failed. Error: 405 Method Not Allowed.”.
Now, we need to enable the webhook for intents that needs to communicate with our server data. To do that, open the intent for which you want to enable webhook, scroll down to the end and enable the “Enable webhook call for this intent” switch.
Whenever this intent is invoked, it will send request to your webhook and respond as per the response set from the webhook.
Training phrases are the sentences that helps the agent to identify/invoke the particular intent.
We have to set up “Actions and Parameters” in the intent which can be used on our webhook to process the request.
In our example, we have setup “get_results” as “Action”. So whenever this intent will call our webhook, in POST request, we’ll get “get_results” as “action”. If there are multiple intents invoking webhook then we can use “action” to differentiate them and based upon that generate different responses.
We can also pass “Parameters” to our webhook. To do that, we can define Parameter name and its value.
Both Actions and Parameters are optional values so webhook call will work even if you don’t pass them. To differentiate intents without action, you can simply check the intent name in the request JSON.
Webhook responses should be in a proper JSON format so that Dialogflow can understand what to display to the user.
You can refer various JSON formats for webhook on this github page.
We are going to build some responses in python using this formats. Types of responses available are: Simple Response, Basic Card, Suggestions, List Card, Browse Carousel, Carousel Response. We will be building all these responses in the upcoming blog.
Below code will prepare a simple JSON response with fulfillment text for Dialogflow. The user will receive “This is a response from webhook.” as response for this intent.
# import flask dependencies
from flask import Flask, request, make_response, jsonify
# initialize the flask app
app = Flask(__name__)
# default route
@app.route('/')
def index():
return 'Hello World!'
# function for responses
def results():
# build a request object
req = request.get_json(force=True)
# fetch action from json
action = req.get('queryResult').get('action')
# return a fulfillment response
return {'fulfillmentText': 'This is a response from webhook.'}
# create a route for webhook
@app.route('/webhook', methods=['GET', 'POST'])
def webhook():
# return response
return make_response(jsonify(results()))
# run the app
if __name__ == '__main__':
app.run()
You can see that we have fetched “action” from the request using
action = req.get('queryResult').get('action')
In our example, we haven’t used action, but if you want you can use it for your purpose.
Using console on right side of the window, we can invoke the intent and check the response. For our example, the response will be as below:
Clicking on “DIAGNOSTIC INFO” button, we can view the all detail about request being sent from Dialogflow and response being sent from our webhook. “DIAGNOSTIC INFO” can also be very useful for debugging, if you have any error in your webhook.
Using this tutorial you can create a basic webhook. If you want to enhance your webhook or make it more powerful then Python Library we created to simplify building the JSON responses for Dialogflow can be pretty useful.
Hope this tutorial will be helpful to you in integrating webhook in your dialogflow app. If you have any question then post it in the comment. We’ll respond to it soon.
(Update: 27th December, 2019)
If you receive “Webhook call failed. Error: PERMISSION_DENIED.” then please check that the URL you are providing as webhook must start with HTTPS not HTTP. It will fix your “Webhook call failed. Error: PERMISSION_DENIED.” error.
So, it should be like https://836b69cc.ngrok.io/webhook not http://836b69cc.ngrok.io/webhook.
Feel free to comment your doubts/questions. We would be glad to help you.
If you are looking for Chatbot Development or Natural Language Processing services then do contact us or send your requirement at letstalk@pragnakalp.com. We would be happy to offer our expert services.
Fill up the form below to download your PythonDemo agent and Webhook for Dialogflow.
Our experts in Generative AI, Python Programming, and Chatbot Development can help you build innovative solutions and scale your business faster.