How to access Dialogflow V2 API from a webpage?

Question

I have a webpage where I want to use dialogflow chatbot. This is a custom chat window, so I don't want to use one click integration. I am able to access the chat agent V1 API using javascript/ajax (by passing client access token in the request header).

But I don't know how to do it in V2 API. The dialogflow documentation is not clear to me(I have setup Authentication by referring this link. I don't know how to proceed further). I'm not familiar with Google cloud either. So a working sample or a step by step how to access the API guideline will be very much appreciated.

This question seems to already have an answer here: https://stackoverflow.com/questions/47059976/get-service-account-auth-token-without-gcloud — gmolau, Jun 03 '18 at 19:04
https://stackoverflow.com/questions/50545943/dialogflow-easy-way-for-authorization/51941682#51941682 ... Try this instead of require.. use import... Working for Angular 6 — Ashish Singh Rawat, Aug 27 '18 at 09:13
Possible duplicate of [Dialogflow easy way for authorization](https://stackoverflow.com/questions/50545943/dialogflow-easy-way-for-authorization) — Ashish Singh Rawat, Aug 27 '18 at 09:16
You must use a web server side to access Dialogflow V2 API. Read this: https://dialogflow.com/docs/reference/v1-v2-migration-guide-api — qnguyen, Feb 21 '19 at 04:42

Nikhil Savaliya · Answer 1 · 2019-07-29T10:43:42.463

You can use Dialogflow Rest APIs, You need to generate access token with Google cloud sdk (scope: cloud platform, dialogflow)

  public df_client_call(request) {
    var config = {
      headers: {
        'Authorization': "Bearer " + this.accessToken,
        'Content-Type': 'application/json; charset=utf-8'
      }
    };   
   return this.http.post(
      'https://dialogflow.googleapis.com/v2/projects/' + environment.project_id +
      '/agent/sessions/' + sessionId + ':detectIntent',
      request,
      config
    )
  }

In the request you have to pass,

{
    queryInput: {
        text: {
            text: action.payload.text,
            languageCode: 'en-US',
        },
    }
}

to trigger Event:,

    {
        queryInput: {
            event: {
                name: action.payload.event,
                languageCode: 'en-US',
            },
        }
    }

sessionId => unique Id for your user

How to access Dialogflow V2 API from a webpage?

1 Answers1

Linked