Home / DialogFlow ES / The easiest way to understand Dialogflow webhooks
DialogFlow ES | Webhooks

The easiest way to understand Dialogflow webhooks

Are you tired of Dialogflow fulfillment tutorials which seem to be out of date by the time you read them?

What if I said there is a way to understand how Dialogflow fulfillment works without using code? Since there is no code, there is very little chance for this approach to become obsolete.

Use a REST API mock service

There is a service called Mockable.io which allows you to mock your API in no time.

First, go to the website and log in using your Google account. You should see a dashboard like this.

Click on the blue Manage button, and then create a new REST Mock.

At the top of the page, add test to the existing URL (note: your URL will be different), and change the Verb to POST.

Leave other settings as they are.

Now scroll down the page and copy paste the following text into the editor: (Note, I am assuming you are using API v2).

  "fulfillmentText": "This is a text response"

Scroll further down. First, turn on “Enable Request Logger”. Then click on the Save button.

You will see a message saying the Mock is stopped. This is completely expected.

Scroll down the page again, click on Start.

Now, you will see the button change color to green, meaning the service is available to use.

Create a new Dialogflow agent and copy/paste the URL into the fulfillment section (remember to use https as the prefix).

In your default welcome intent, enable the webhook.

Type Hi (or whatever will trigger the default welcome intent in your agent) into the Dialogflow simulator. You should see the response coming back from the mock service.

Benefits of using a mock API service

So why is this the easiest way to start learning about webhooks?

When I talk to people who don’t have much experience with programming, one of the things I have noticed is that they are not very comfortable with the sequence of steps involved in creating a webhook

  • you need a way to “capture” the JSON sent to your webhook URL
  • you need to parse this JSON to extract relevant information
  • you need to apply some business logic on the JSON data you received inside your code
  • you need to construct a response JSON in the exact format that Dialogflow expects

And naturally, to be able to do every single one of these steps, you already need to understand your programming language quite well.

The big advantage of this approach is that it takes the above steps and removes the hardest step – mastering a programming language. 🙂

So now, you have a way to understand the request-response exchange well without having to write code.

So here are some benefits of using a Mock API service:

Programming language agnostic

Like I mentioned, you can use this even if you don’t know how to code, or you are just learning the basics. (Although ideally, you are actually trying to learn coding. Otherwise, this approach can only take you so far).

Requests can be inspected

Remember I asked you to click on the “Enable Request logger”?

Go to the dashboard, and select “View Logs” option:

Click to expand the request.

Now scroll down and you see the request JSON within the payload:

A quick tip: you may want to copy the JSON from inside the Payload box into a more visualization friendly tool.

This is the exact JSON that is sent to your webhook.

Final response can be generated by copy/paste

By this, I mean that you can very easily copy some JSON mentioned in the documentation, paste it into the JSON response editor, and you are good to go.

Response can also be modified easily

Related to the previous point, it is also possible to quickly modify the actual JSON to slightly change it according to your specific need. If you were to try to make such small changes with code, you probably know that it is going to take you some effort to set it up.


Use a mock API service such as mockable.io service to start understanding how webhooks work. When you understand the request-response lifecycle well, you can then move on to using your programming language to write code to replicate the behavior of the mock API service.

<— End of article —>

This website contains affiliate links. See the disclosure page for more details. 
"The magic key I needed as a non-programmer"

The custom payload generator was the magic key I needed (as a non-programmer) to build a good demo with rich responses in DialogFlow Messenger. I've only used it for 30 minutes and am thrilled. I've spent hours trying to figure out some of the intricacies of DialogFlow on my own. Over and over, I kept coming back to Aravind's tutorials available on-line. I trust the other functionalities I learn to use in the app will save me additional time and heartburn.

- Kathleen R
Cofounder, gathrHealth
"Much clearer than the official documentation to be honest"

Thanks a lot for the advice (of buying and following your videos)! They helped a lot indeed. Everything is very clear when you explain, much clearer than the official documentation to be honest 🙂

Neuraz T
Review for Learn Dialogflow CX
"I will strongly recommend this course because even I can learn how to design chatbot (no programming background)"

I think Aravind really did a great job to introduce dialogflow to people like me, without programming background. He organizes his course in very clear manner since I have been a college professor for 20 years. It is very easy for me to recognize how great Aravind’s course is! Very use-friend and very easy to follow. He doesn’t have any strong accent when he gives the lectures. It is so easy for me to understand. Really appreciate it.

Yes, I will strongly recommend this course because even I can learn how to design chatbot (no programming background) after studying Avarind’s course, you definitely can!

Ann Cai
Review for Learn Dialogflow ES

Similar Posts