2

我想从我的 React 应用程序与 Dialogflow CX API 进行通信。相关代码如下所示：

componentWillMount() {
    let payload = {
        "queryInput": {
            "text": {
                "text": "Hi!"
            },
            "languageCode": "en"
        },
        "queryParams": {
            "timeZone": "America/Los_Angeles"
        }
    }
    axios.post('https://global-dialogflow.googleapis.com/v3/' + this.state.projectId + '/sessions/' + this.state.sessionId + ':detectIntent', payload)
        .then(response => {
            this.setState({ dialogResponse: response });
        })
        .catch(error => {
            console.log(error)
        })

    console.log(this.state.dialogResponse)
}

然而，回应是401。

我已经创建了一个服务帐户并按照https://cloud.google.com/docs/authentication/将私钥下载为 JSON 文件。

然后如何使用它来验证我的 API 调用？

4

2 回答 2

1

根据文档，使用服务帐户密钥（您下载为 JSON 文件的密钥）仅用于

代表 Google Cloud 环境之外的服务帐号访问私有数据

这些用于以下情况：

  1. 用户不在场进行身份验证；或者
  2. 不需要用户的服务器端请求。

对于您的用例，我认为它适用于后者，因为您使用的是 Dialogflow。将此 api 调用移动到您的服务器端代码上，例如通过设置在某处运行的云函数、lambda 或 expressjs 应用程序。

不要在 React 上运行这个请求有两个主要原因：

  1. React 是客户端，这意味着用户可以访问您的源代码，包括您的私钥。安全隐患大。
  2. Dialogflow 不需要对用户进行身份验证即可工作。

要在您的请求中添加身份验证并使用 Dialog CX，您可以按照此处松散的这些步骤进行操作。请注意，这些步骤适用于您的服务器在 GCP 内部或外部运行时。如果您的代码在 GCP 中运行，Google 有一个内置功能，但我将解释在任何地方都可以使用的功能。所有这些都应该在你的云函数/lambda/expressjs 应用程序中，所以如果你不熟悉该研究如何设置一个以及如何首先在 React 中调用它。

  1. 安装 dot-env 并要求它npm install dotenv或yarn add dotenv
  2. 在应用程序中需要 dotenvrequire('dotenv').config()
  3. 下载私钥 json 将其保存在项目文件夹中的某个位置）
  4. 添加.env到您的.gitignore文件中（如果还没有）
  5. 创建.env文件并将其添加到其中 GOOGLE_APPLICATION_CREDENTIALS="[PATH TO YOUR PRIVATE KEY]"
  6. 安装 Dialogflow CX 库npm install @google-cloud/dialogflow-cx
  7. 根据此处的文档使用 Dialogflow 库。使用库时会自动检测服务私钥。
  8. 在生产环境中，确保将GOOGLE_APPLICATION_CREDENTIALS="[PATH TO YOUR PRIVATE KEY]"环境变量添加到云函数、lambda、docker 或您将使用的任何内容中。

作为补充说明，如果您已经将私钥提交到您的 github 存储库，请刷新您的私钥并将其从您的 React 项目文件夹中删除。

于 2021-02-24T03:45:29.010 回答
0

最后，我无法通过将 JSON 凭据添加到.env(did install dotenv) 来使其工作。我最终做了什么：

  • 将 API 调用移至我的 Express 服务器

  • 将 JSON 文件添加到我的项目文件夹

  • 使用@google-cloud/dialogflow-cx库如下：

     const { SessionsClient } = require('@google-cloud/dialogflow-cx');
 const client = new SessionsClient({
   keyFilename: "./my-file-name.json" //include the JSON file here!
 });

 ...

 app.get('/input', async (req, res, next) => {
   try {
     const sessionId = Math.random().toString(36).substring(7);
     const sessionPath = client.projectLocationAgentSessionPath(
       projectId,
       location,
       agentId,
       sessionId
     );
     console.info(sessionPath);

 const request = {
   session: sessionPath,
   queryInput: {
     text: {
       text: 'Hi there',
     },
     languageCode,
   },
 };

 const [response] = await client.detectIntent(request);
 for (const message of response.queryResult.responseMessages) {
   if (message.text) {
     console.log(`Agent Response: ${message.text.text}`);
   }
 }
 if (response.queryResult.match.intent) {
   console.log(
     `Matched Intent: ${response.queryResult.match.intent.displayName}`
   );
 }
 console.log(
   `Current Page: ${response.queryResult.currentPage.displayName}`
 );

    } 捕捉（错误） { 返回下一个（错误） } }）

于 2021-02-24T12:04:28.737 回答