Question

我正在尝试从Dialog Web Demo的iframe中提取服务器响应文本

这是我的代码-当前，输出为null：

<!DOCTYPE html>
<html lang=\"en\">
<head><meta name=\"viewport\" content=\"width=device-width, initial- scale=1, user-scalable=no\"/>
<title>Dialog</title>
</head>
<body>
<div align="center">
<iframe
    id="dialog"
    allow="microphone;"
    width="350"
    height="430"
    src="https://console.dialogflow.com/api-client/demo/embedded/xxxxxxxxxxxxxxxxxxxxxxxxxxx">  
</iframe>
</div>
<div align="center">
<script>
     var dialogFrame = document.getElementById("dialog");
     var dialogDocument = dialogFrame.contentWindow.document;
     var dialogResponse = dialogDocument.getElementById("server-response");
     document.write(dialogResponse);
</script>
</div>
</body>
</hmtl>

我希望提取Dialogflow响应的文本，但结果是null。

Answer 1

无法从HTML <iframe>元素（仅是一个显示块）中检索数据。可以通过API调用检索数据；在Dialogflow中，您可以通过Fulfillments获得此数据。

检查以下流程以在App Engine上部署Node应用，在默认端点上提供Dialogflow聊天，并在/fulfillment端点上发布履行数据。

A）Configure fulfillment

请注意以下几点：

URL：输入您的HTTPS Express POST端点（例如https://[PROJECT_ID].appspot.com/fulfillment）
将所有其他字段留空
域：为所有域启用Webhook
创建并保存后，您仍需要为正在使用的每个Intent（及其后续操作，如果有的话）启用实现功能

B）申请

从控制台在App Engine中创建Node App

然后部署此应用，将<iframe>替换为您的应用：

app.yaml

runtime: nodejs8

package.json

{
  "dependencies": {
    "actions-on-google": "^2.5.0",
    "dialogflow-fulfillment": "^0.5.0",
    "express": "^4.16.4"
  },
  "scripts": {
    "start": "node index.js"
  }
}

index.js

'use strict';

const {WebhookClient} = require('dialogflow-fulfillment');
const express = require('express');
const bodyParser = require('body-parser');
var path = require('path');

const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: true}));

function WebhookProcessing(req, res) {
    const agent = new WebhookClient({request: req, response: res});

    console.log('Dialogflow Request headers: ' + JSON.stringify(req.headers));
    console.log('Dialogflow Request body: ' + JSON.stringify(req.body));

    console.log(JSON.stringify(req.body.queryResult.queryText));
    console.log(JSON.stringify(req.body.queryResult.fulfillmentText));

}

app.get('/', (req, res) => {
    res.sendFile(path.join(__dirname + '/index.html'));

});

app.post('/fulfillment', function (req, res) {
    WebhookProcessing(req, res);
});

const PORT = process.env.PORT || 8080;
app.listen(PORT, () => {
  console.log(`Server listening on port ${PORT}...`);
});

index.html

<!DOCTYPE html>
<html lang=\"en\">
<head><meta name=\"viewport\" content=\"width=device-width, initial- scale=1, user-scalable=no\"/>
<title>Dialog</title>
</head>
    <body>
        <div align="center">
            <iframe
                allow="microphone;"
                width="350"
                height="430"
                src="https://console.dialogflow.com/api-client/demo/embedded/xxxxxxxxxxxxxxxxxxxxxxxxxxx">  
            </iframe>
        </div>
    </body>
</hmtl>

用户在聊天中开始对话时，功能WebhookProcessing输出每个请求的正文和标头的日志（用户发送的每条消息），并提取并记录两个字段{{1 }}（用户的消息）和queryText（Bot的回复）。

请注意，这只是App Engine中集成的一个示例，您还可以考虑部署Cloud Function，如果您使用Firebase数据库，则可以use the inline editor and deploy the function from Dialogflow。

如何从Dialogflow Web演示的iframe获取文本

1 个答案: