在网站上集成 api.ai 个聊天机器人

Question

我想在我的网站上安装一个聊天机器人，其对话风格类似于 Facebook Messenger。我希望它作为聊天 window 在同一页面上，而不是在单独的页面上。我怎样才能做到这一点？提前谢谢你。

Answer 1

Api.ai 提供名为 Web Demo.

的集成

You can find that in integrations.

Turn it ON and copy the produced iframe to your website.

This is how it looks:

Answer 2

试用用于 DialogFlow (api.ai) 集成的 Kommunicate 实时聊天小部件。 https://docs.kommunicate.io/docs/web-installation.html

这是在网站上添加 api.ai（对话流）的分步指南：https://www.kommunicate.io/blog/how-to-integrate-bot-using-dialogflow-in-kommunicate-1ac32911a7d0/

Answer 3

是的，dialogflow 中有一种方法可以做到这一点。您只需在 html/angular 或您想要设计的任何框架中创建一个简单的聊天 window。您可以只捕获用户输入的查询并进行 ajax 调用并将其传递给 dialogflow。同样，这取决于您使用的 api 版本。 Dialogflow 为您提供 v1/v2 apis，它本身会更改请求格式。请查看下面的代码（使用 v1 api）：

function captureUserQuery() {
         var text = jQuery(".my-text").val();
         dialogflowApi(text);  
}

function dialogflowApi(text) {
         jQuery.ajax({
            type: "POST",
            url: "https://api.dialogflow.com/v1/query?v=20170712",
            contentType: "application/json; charset=utf-8",
            headers: {
                "Authorization": "Bearer " + access_token
            },
            data: JSON.stringify({
                query: text,
                lang: "en",
                sessionId: "chatbot"
            }),
            success: function(response) {
                console.log("success");
                // Here you will get the response to your query in json, you will have to parse it based on the type it has like text, image, card etc. & show it to user. 
                parseResponse(response); // function to parse your response. 
            },
            error: function() {
                console.log("Error");
            }
        });
}

希望这能回答您的问题。如果您还有更多，请告诉我。

Answer 4

2018 年阅读者的一些更新：

1) Api.ai 现在称为 DialogFlow

2) 有一个 https://github.com/dialogflow/dialogflow-javascript-client repo，里面有 demo。只需在 master 分支上执行 npm i 和 npm start（v2 对我不起作用）