Error: Uncaught (in promise): TypeError: gax.GrpcClient is not a constructor

[sreekanthpalagiri]

I am building a chat bot using angular. I have used exact same code list on this page to query my intent, i am getting the below issue:

ERROR Error: Uncaught (in promise): TypeError: gax.GrpcClient is not a constructor TypeError: gax.GrpcClient is not a constructor at new SessionsClient (sessions_client.js:80) at getintentdetails.ts:23 at Generator.next () at tslib.es6.js:73 at new ZoneAwarePromise (zone-evergreen.js:876) at Module.awaiter (tslib.es6.js:69) at getintentdet (getintentdetails.ts:9) at ChatComponent.addMessagefromUser (chat.component.ts:32) at Object.eval [as handleEvent] (ChatComponent.html:27) at handleEvent (core.js:34789) at resolvePromise (zone-evergreen.js:797) at new ZoneAwarePromise (zone-evergreen.js:879) at Module.awaiter (tslib.es6.js:69) at getintentdet (getintentdetails.ts:9) at ChatComponent.addMessagefromUser (chat.component.ts:32) at Object.eval [as handleEvent] (ChatComponent.html:27) at handleEvent (core.js:34789) at callWithDebugContext (core.js:36407) at Object.debugHandleEvent [as handleEvent] (core.js:36043) at dispatchEvent (core.js:22533)

Code that i am using:

const dialogflow = require('dialogflow').v2; const uuid = require('uuid');

/**

• Send a query to the dialogflow agent, and return the query result.
• @param {string} projectId The project to be used */

export async function getintentdet(projectId: String) { // A unique identifier for the given session const sessionId = uuid.v4();

//let privateKey = 'MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDimI7Y88jyKYVU\ndo5Q6xqCeFfO3hk2y3ii04OvC2H9BHu0ZwqZju7V/wDDm2RpJ7aIFK1iwE8DV9X1\naXvaKq//Nfp/hlg8xzc37rn3iQdq4vuSl9LThs+h0hz0RcHd0SD+hNgLxdlFddkw\nIvk/9+0jGSLCRSCtcZ3IbAs/9MvMTCItheVboUPSsRSF4PgohfnaQK8FonN24idk\nJjwUhw0hr8m7dIBf20spKwkM87ek6qMvU8ApbdZLl/H/1fUUbxYjWSeAoQRTvK3P\nu08Jy4u/DH9gD76IKJzETNid/hHPEFkBKY0MYtCQWbjsfUKIdTqwMNrPRC5k4IUW\n4AhQotCfAgMBAAECggEAYghxqMAT3F0FT4z5Nl34uqCZEKk7DF9MQlmzG4yXqLED\nWgHIbrYNc2zfJkF42Buz1zzm5JXhuUcLjKDF0hXszcPLK9fyHd1scNjqAQN6P46T\nG5Fux1AITXDLUQ1K+g4LscHEfJds0CXTwIUpA7leEXTC+nyQzikdA8Rmu5VLhIdN\nSoywK2JnLLKhJ20r2p61rg58PSFYcRXrNEXxnL7E6c2qvWGAacVoTZPuj3nWGhnQ\nDfJ3KKOnNaTe2Qh9pLIzJgalHOlwY+VyRLDvQAsUqlJbQ/zSUlhrpeTKJQ6m0Asa\nUUbno3Ukgv49t6j9yzmVDRizj6sG7C/WHTdkXHHlUQKBgQDzM9VeONNBg22cGYcW\nywVJFdC1gl6/9x+5g44ar0N/qIXst2QArvPaLUvL4BV1lbt8b5eL65VSWpqqq2T3\n2c75nMe/myA1odECVVpq7wjy6AJ4ak8ZfVvQ1y7hldTJDCzGorszeH0mR18hiiz9\nx3dOXMIr1uRHOymNCoFBI5durwKBgQDuhQTK1XCx9NBquK/uk4yGToKGvJslJWLk\nY3UTsCMHes+Bre5vSsoInWRPR2sjp7khDc2Xu/eaaDJgolW5lBpZo9iQy/gTddk2\nnbz7Q4bqEa+cf1svPI0m89N40Ze2hNo0n4uU5gxaqavW8+JUN+c3soEJqW83Ei27\nYNzAqui5EQKBgQDBJGYMKRblDYpsEP3uxRcSfse8jqfOzmScgPTHDm+Nn3mUj+RU\ngpzYpWZvqCuCsYIvBbSWA2cX+yqf5fQOviSYqcEc0waWcUc7Eiv3hpRVzJnBpbPh\n62OSjIIH12UgsZGRwsTm0Iabcs0DJugqN1Hxosr14/hw9XQ/NZuG7swhswKBgEQo\n7v2nkNTJyOU2cdATigy3UsV+EDfFP0VUxpghtWDlz3aXZZOYI7Pihk/BcPR3cYfo\nkd/SbydIr1y+BxFJKV6EW9bE8tdczf21hdOnsF4jP7PRERWmkA+Zjczw2BHoVRLE\npPaf5tfhtKFwgDTg5Mod0JIaQRXTtA3f2DWWoXqBAoGBAKC9Elf3DKciLv8QYfnK\n1o24/jeKgYp8imdtWCcGmQ3ce1Fwrrf1y9jbkdfmoLeHoxAWCWH8AYaMMX0Epm1g\nrX+eDps4fLZHjEvdEMR+0H/nNaxa4NJCf4Vs52eojsPPwZl0k2hNEIyIENH++YTJ\ngBD1FPlXU4CQx1A4iUMeVMBA';
// as per goolgle json
//let clientEmail = "applbotserviceforapi@applsupportprod-rsmosb.iam.gserviceaccount.com";
//let config = {
  //credentials: {
    //private_key: privateKey,
    //client_email: clientEmail
  //}
//}

const sessionClient = new dialogflow.SessionsClient();
// Create a new session
//const sessionClient = new dialogflow.SessionsClient({ 
//  keyFilename: "C:\Work\angular\applsupportprod-rsmosb-0c5c813dacc8.json"
//});
const sessionPath = sessionClient.sessionPath(projectId, sessionId);

// The text query request.
const request = {
  session: sessionPath,
  queryInput: {
    text: {
      // The query to send to the dialogflow agent
      text: 'hello',
      // The language used by the client (en-US)
      languageCode: 'en-US',
    },
  },
};

// Send request and log result
const responses = await sessionClient.detectIntent(request);
console.log('Detected intent');
const result = responses[0].queryResult;
console.log(`  Query: ${result.queryText}`);
console.log(`  Response: ${result.fulfillmentText}`);
if (result.intent) {
  console.log(`  Intent: ${result.intent.displayName}`);
} else {
  console.log(`  No intent matched.`);
}

}

My package.json:

{ "name": "applsupporbot", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^8.0.3", "@angular/cdk": "^8.0.1", "@angular/common": "~8.0.1", "@angular/compiler": "^8.1.2", "@angular/compiler-cli": "^8.1.2", "@angular/core": "^8.0.2", "@angular/forms": "~8.0.1", "@angular/material": "^8.0.1", "@angular/platform-browser": "~8.0.1", "@angular/platform-browser-dynamic": "~8.0.1", "@angular/router": "~8.0.1", "axios": "^0.19.0", "crypto": "^1.0.1", "dialogflow": "^0.10.3", "google-gax": "^1.1.5", "googleapis": "^41.0.1", "grpc": "^1.22.2", "ng-gapi": "0.0.73", "ngx-avatar": "^3.7.0", "rxjs": "^6.4.0", "tslib": "^1.9.0", "zone.js": "~0.9.1" }, "devDependencies": { "@angular-devkit/build-angular": "~0.800.0", "@angular/cli": "^8.1.2", "@angular/language-service": "~8.0.1", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "@types/node": "^8.10.51", "codelyzer": "^5.0.0", "jasmine-core": "~3.4.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.1.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.0", "protractor": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.4.3" }, "browser": { "google-gax": false, "fs": false, "crypto": false, "http": false, "http2": false, "https": false, "net": false, "os": false, "path": false, "stream": false, "zlib": false, "tls": false, "child_process": false } }

[bcoe]

@sreekanthpalagiri are you attempting to load dialogflow in the frontend of your application? as of right now our libraries do not work in a front-end context.

CC: @alexander-fenster is dialogflow on your radar for some of the work we're doing around making our gRPC libraries webpackable?

[alexander-fenster]

@bcoe We won't be able to support streaming calls in browser (e.g. streamingDetectIntent), other than that, we'll be more than happy to try converting dialogflow to browser version and see how it works!

One thing that will be different compared to the current client library usage is that we'll need to use google-auth-library OAuth2Client to perform the complete OAuth2 workflow (redirect to authentication URL, accept the code, request a token). There will be no service account key support for browser usage.

[alexander-fenster]

cc: @ramya-ramalingam, @LibanOdowa

[sreekanthpalagiri]

Thanks @alexander-fenster, @bcoe . I have now created a java service to connect to dialog flow and we will have front end call it. I will look to update our project when browser support is available.

[callmehiphop]

Sounds like this is safe to close, please let us know if that is not the case.