The most important tip for building Dialogflow webhooks

Here is the tip: unless you use ngrok, you are going to find it very difficult to build your webhook. What is ngrok?

ngrok

Here is the definition of nGrok:

“Ngrok is a multiplatform tunnelling, reverse proxy software that establishes secure tunnels from a public endpoint such as internet to a locally running network service while capturing all traffic for detailed inspection and replay.“

OK, that may sound quite complicated. But here is what it means for you:

1 Install ngrok and follow setup instructions

2 Go to your webhook URL in Dialogflow

3 Replace it with a URL which will be generated by your nGrok installation

4 Make sure you configure your IDE to use the correct port

What happens when you use ngrok

1 User types a message to your Dialogflow agent

2 Dialogflow decides that it needs to call a webhook based on your setting

3 It looks up the webhook URL and finds the nGrok generated URL

4 Dialogflow sends the JSON post request to the nGrok generated URL

5 Some ngrok magic happens behind the scenes

6 The JSON post request is sent to your local development machine

7 If you configured everything properly in your IDE, you can set a breakpoint in your webhook code and that breakpoint should be hit by the incoming JSON post request

8 Now you can patiently step through the code and see if something is broken