Search code examples
angularfirebasechatbotdialogflow-es-fulfillment

What is the dialogflowURL when connecting Angular, Nebular, and Dialogflow?


I am following this tutorial, which is a nice start, but leaves out a lot of details about the implementation.

Line 4 of the component typescript file is the following:

const dialogflowURL = 'https://us-central1-fireship-lessons.cloudfunctions.net/dialogflowGateway';

For my project id, yalebot-n9xq, I think the accurate URL is:

https://dialogflow.googleapis.com/v2/projects/yalebot-n9xq/dialogflowGateway

However, curl https://dialogflow.googleapis.com/v2/projects/yalebot-n9xq/dialogflowGateway gives a 404 response:

<p>The requested URL <code>/v2/projects/yalebot-n9xq/dialogflowGateway</code> was not found on this server.  
<ins>That’s all we know.</ins>

What URL should I be using if my project id is yalebot-n9xq?

  1. I have enabled the webhook for the welcome intent.
  2. If I don't use angular and serve locally (curl http://localhost:5000/yalebot-n9xq/us-central1/dialogflowGateway), I have the desired response from dialogflow.
  3. ng serve yields http://localhost:4200/, but visiting that site or /# yields the error 'Cannot GET /', which is why I believe my error is in typing the correct URL.

Solution

  • The answer is that Dialoflow looks for an external webhook.

    In this example, const dialogflowURL = 'https://YOUR-CLOUDFUNCTION/dialogflowGateway'; the YOUR-CLOUDFUNCTION refers to an external URL, perhaps something externalized with ngrok or lite-server.

    The example works fine with an external URL that is cross-listed under the DialogFlow fulfillment tab.