如何將 Dialogflow v2 與 javascript 前端 (Vue.js) 集成

Question

我正在嘗試根據文檔的示例 HTTP 請求將 Dialogflow 與 Vue.js（和 axios）集成： https ://dialogflow.com/docs/reference/v2-auth-setup 和 detectIntent： https ://dialogflow.com /docs/reference/api-v2/rest/v2beta1/projects.agent.sessions/detectIntent 。

我有一個設置了足夠權限的服務帳戶，並為其提供了文檔中所示的路徑參數和請求正文，但是在調用detectIntent API 時，我不斷收到“錯誤：請求失敗，狀態代碼為 400”。

不過，有幾件事我不確定：

1. 如何獲取 sessionId？ 目前，我只是從 Firebase 函數日志中復制 sessionId，它會在直接通過 Dialogflow 控制台輸入查詢時顯示。

2. 我如何在 javascript 代碼中實際實現 $(gcloud auth print-access-token) ？ 目前我正在終端中運行命令並將令牌粘貼到代碼中，只是為了測試 API 是否有效，但我不知道它應該如何實現。

（也許有用，我在函數文件夾中設置了履行，並且運行良好。）

提前致謝！

 <script> import axios from 'axios' export default { name: 'myChatBot', mounted () { // Authorization: Bearer $(gcloud auth print-access-token) const session = 'projects/mychatbot/agent/sessions/some-session-id' const token = 'xxxxxxxxxxxx' axios.defaults.baseURL = 'https://dialogflow.googleapis.com' axios.defaults.headers.common['Authorization'] = `Bearer ${token}` axios.defaults.headers.post['Content-Type'] = 'application/json' axios .post(`/v2beta1/${session}:detectIntent`, { "queryInput": { "text": "add buy milk to inbox", "languageCode": "en-US" } }) .then(response => console.log(response)) .catch(error => console.log(error)) } } </script>

Answer 1

您可以使用 JWT 授權來處理您的 #2 問題。 你只需要把你的 JSON 文件放在安全的地方。 https://developers.google.com/identity/protocols/OAuth2ServiceAccount#jwt-auth

你得到代碼 400 的原因是因為你的參數有點偏離。 這是您的帖子的外觀（我還添加了一些額外的代碼來處理令牌生成）：

 <script> import axios from 'axios' import { KJUR } from 'jsrsasign' const creds = require('./YOUR_JSON_FILE') export default { name: 'myChatBot', data() { return { token: undefined, tokenInterval: undefined } }, created() { // update the tokens every hour this.tokenInterval = setInterval(this.generateToken, 3600000) this.generateToken() }, mounted () { this.detectIntent('add buy milk to inbox') }, beforeDestroy() { clearInterval(this.tokenInterval) }, methods: { generateToken() { // Header const header = { alg: 'RS256', typ: 'JWT', kid: creds.private_key_id } // Payload const payload = { iss: creds.client_email, sub: creds.client_email, iat: KJUR.jws.IntDate.get('now'), exp: KJUR.jws.IntDate.get('now + 1hour'), aud: 'https://dialogflow.googleapis.com/google.cloud.dialogflow.v2.Sessions' } const stringHeader = JSON.stringify(header) const stringPayload = JSON.stringify(payload) this.token = KJUR.jws.JWS.sign('RS256', stringHeader, stringPayload, creds.private_key) }, detectIntent(text, languageCode = 'en-US') { if (!this.token) { // try again setTimeout(this.detectIntent, 300, text, languageCode) return } // error check for no text, etc. const session = 'projects/mychatbot/agent/sessions/some-session-id' axios.defaults.baseURL = 'https://dialogflow.googleapis.com' axios.defaults.headers.common['Authorization'] = `Bearer ${this.token}` axios.defaults.headers.post['Content-Type'] = 'application/json' axios .post(`/v2beta1/${session}:detectIntent`, { queryInput: { text: { text, languageCode } } }) .then(response => console.log(response)) .catch(error => console.log(error)) } } } </script>

您可以看到，在QueryInput 中，它采用了 3 種不同類型的對象中的一種（“文本”就是其中之一）。

Answer 2

在鏈接中，它在 HTTP 請求會話路徑參數下聲明“由 API 調用者選擇合適的會話 ID。它可以是隨機數或某種類型的用戶標識符（最好是散列的）。

對於與 Dialogflow V2 的集成，這里有一個使用易於集成和開始使用的第三方工具的示例。

Answer 3

sessionId是您可以提供的標識符，它將向 Dialogflow 指示后續請求是否屬於用戶交互的同一“會話”（ 請參閱文檔）。

對於客戶端對 API 的第一個請求，您可以生成一個隨機數用作會話 ID。 對於來自同一客戶端的后續請求（例如，如果用戶繼續與您的代理交談），您可以重復使用相同的號碼。

只要您使用的服務帳戶的訪問權限受到適當限制（因為此令牌可能允許任何人向 Google Cloud API 發出請求），您的令牌管理實現看起來不錯。 為了提高安全性，您可以考慮通過您自己的服務器將請求代理到 Dialogflow，而不是從客戶端進行調用。