1. 简介
上次更新时间:2021 年 8 月 23 日
使用 Business Messages 转移实时代理
借助 Business Messages 的人工客服转接功能,您的客服人员能够以聊天机器人的身份发起对话,并在对话过程中将对话切换为人工客服(真人代表)。聊天机器人可以处理诸如营业时间等常见问题,而人工客服可以为用户提供定制的体验,从而更深入地了解用户的背景信息。如果这两种体验能够无缝转换,用户就可以快速准确地回答问题,从而实现更高的回报互动率和客户满意度。
在此 Codelab 中,您将了解如何充分利用实时代理转接功能。
构建内容
在此 Codelab 中,您将为代理构建一个 webhook,用于发送和接收实时代理转移作业事件。您将使用起始代码提供的基本界面来测试您所构建的内容。
学习内容
- 如何存储和管理对话状态。
- 如何使用 Business Messages 发送人工客服转接事件。
- 如何设置网络钩子和基本界面,以便以代理身份加入对话。
- 使用 Business Messages API 的最佳实践。
此 Codelab 将重点介绍如何使用 Business Message API 实现实时客服人员转接。您可以仔细阅读每个阶段的起始代码,但您只需实现与 Business Messages 相关的代码。
所需条件
- Business Messages 代理,包括您的服务帐号密钥。您可以按照“创建代理”指南来创建代理。
- 关联到代理的 GCP 项目的有效 Cloud Datastore 配置。您可以参考 Cloud Datastore 快速入门进行设置。您无需了解如何使用 Cloud Datastore。
- 一台安装了 Google Cloud SDK 和 Node.js(10 或更高版本)的计算机。
- 一台用于测试用户体验的 Android 设备(搭载版本 5 或更高版本)或 iOS 设备。
- 拥有 Web 应用编程经验。您需要编写少量 JavaScript 代码,并且可能需要对所编写的内容进行调试。
2. 创建 echo 聊天机器人
在此步骤中,您将部署一个名为“Echo 聊天机器人”的基本聊天机器人代表。该聊天机器人会接收用户消息,将其记录到 Cloud Datastore 中的对话线程,然后通过在回复中相同的内容“回显”用户的消息。拥有基本的聊天机器人和日志记录基础架构后,您可以在其上添加内容,以在后续步骤中创建完整的实时代理转移作业实现。
获取起始代码
在终端中,使用以下命令将 Live Agent Transfer 起始代码克隆到项目的工作目录中:
git clone https://github.com/google-business-communications/bm-nodejs-live-agent-transfer
了解起始代码
我们来看看您将在整个 Codelab 中使用的起始代码结构。
进入 step-1
目录并查看其内容。它包含以下元素:
- bin:此目录包含用于设置和配置服务器的 www 启动脚本。
- libs:此目录包含
datastore_util.js
,其中包含用于从 Cloud Datastore 读写数据的便捷方法。您无需了解此文件的运作方式。只需注意可用的方法及其作用即可。 - resources:这会以名为
credentials.json
的文件的形式包含您的服务帐号密钥。 - routes:
index.js
文件包含 webhook 及其所有辅助方法。这是您将使用和添加的主文件。 - views:此目录包含用于界面元素的 EJS 模板文件。后续步骤中将包含更多文件。
- app.js、app.yaml、package.json:这些文件用于配置应用及其依赖项。
在部署之前,请下载您的 GCP 服务帐号密钥并将 JSON 凭据文件复制到示例代码中的每个资源目录中。您在此 Codelab 的每一步中都要执行此操作。
cp credentials.json bm-nodejs-live-agent-transfer/step-<step number>/resources/credentials.json
部署起始代码
在终端中,转到示例的 step-1
目录。然后,设置用于注册 API 的项目 ID,将 gcloud 工具设置为使用您的 Google Cloud 项目。
gcloud config set project <PROJECT_ID>
如需部署应用,请运行以下命令:
gcloud app deploy
请记下最后一个命令输出的内容中已部署应用的网址:
Deployed service [default] to [https://PROJECT_ID.appspot.com]
您刚刚部署的起始代码包含一个 Web 应用,该应用使用网络钩子从 Business Messages 接收消息。该应用向用户回显消息,并将消息线程记录到 Cloud Datastore 中。
配置您的代理
前往 Business Communications 开发者控制台中的“帐号设置”页面,然后将您的网络钩子设置为已部署应用的网址。例如,https://PROJECT_ID.appspot.com/callback/
。
然后,在“代理信息”页面上,将主要和辅助互动类型分别配置为“聊天机器人”和“人工”。
与 Echo 聊天机器人对话
在 Developer Console 中打开您的代理。您将看到概览页面,在此页面中可以查看代理的详细信息。复制与您的移动设备测试设备匹配的代理测试网址。请在移动设备上使用此网址启动代理的对话界面。
通过发送一些消息与客服人员互动。对话界面只会复制您说的话,用户体验并不实用。如果真有办法,能与真人交谈!
3. 加入对话
现在,让我们从人工客服的角度来看待对话。作为人工客服,在加入之前,您需要知晓一些对话的相关信息(例如对话 ID)。了解用户是否请求与人工客服沟通也很有帮助。在此步骤中,您将使用基本的 CRM(客户关系管理)页面来查看这些信息,并以人工客服的身份加入对话。
此步骤的起始代码会添加一个基本的 CRM,其中会列出客服人员的所有正在进行的对话会话。我们来看一下该 CRM 系统,看看哪些对话可能需要人工客服注意。
转到 step-2
目录,然后按照上一步的方式再次部署应用。
部署应用时,您会看到目标网址。在浏览器中转到此网址,即可查看您在上一步中开始的对话会话的商家信息。对话的状态为“由聊天机器人管理”,因为 echo 聊天机器人在此对话中是客服人员的代表。
系统会显示加入聊天按钮,但尚未执行任何操作。您也无法通过此界面判断用户是否想要与人工客服交谈。
Business Messages 提供了人工客服请求的事件,可指明用户何时想要与人工客服对话。您需要跟踪该状态才能在界面中列出它。
查看 index.js
中的回调方法。TODO
注释表示您需要在哪里捕获用户对实时代理的请求并更新线程状态。
step-2/routes/index.js
/**
* The webhook callback method.
*/
router.post('/callback', async function(req, res, next) {
...
} else if (requestBody.userStatus !== undefined) {
if (requestBody.userStatus.requestedLiveAgent !== undefined) {
...
// TODO: Update the thread state to QUEUED_THREAD_STATE.
}
}
});
...
});
您需要使用 libs/datastore_utils.js
中的方法加载当前对话线程,并将其状态更新为 QUEUED_THREAD_STATE
。
如果您不确定该怎么做,请查看解决方案。起始代码在需要完成一些代码的每个步骤下都有一个 solutions
目录。这些目录包含整个应用的副本,其中包含特定步骤的完整实现。
完成实现并重新部署应用后,请使用移动设备对话中的菜单来请求人工客服。
现在,如果您返回 CRM,应该会在对话消息中看到一条内容为“已请求人工客服”的备注。此用户需要人工帮助!您需要实现 joinConversation
端点,才能使按钮正常工作。
在 /joinConversation
的存根方法中找到其他 TODO
注释。
step-2/routes/index.js
/**
* Updates the thread state and sends a representative join signal to the user.
*/
router.post('/joinConversation', async function(req, res, next) {
let conversationId = req.body.conversationId;
// TODO: Update the thread state to LIVE_AGENT_THREAD_STATE and post a REPRESENTATIVE_JOINED event.
res.json({
'result': 'ok',
});
});
您需要再次更新线程状态,这次更新为 LIVE_AGENT_THREAD_STATE
。此外,您还需要使用 Business Messages API 的 conversations.events.create
方法发布 REPRESENTATIVE_JOINED
事件。
如需创建请求载荷,您需要设置下表中列出的字段:
字段名称 | 提示 |
| 将此项设置为“conversations/{conversationId}”。 |
| 为活动生成您自己的随机 ID。 |
| 使用提供的 |
| 这是事件正文本身。您应设置 eventType 和代表性。 |
查看 create 方法的参考页面或事件参考页面以获得帮助。
完成实现后,重新部署应用并点击加入聊天按钮。系统会显示已加入的对话对话框,且聊天状态会更改为“实时聊天”。如果您在移动设备上查看对话,则会在聊天中看到一条备注,告知您人工客服已加入。
恭喜!在下一步中,我们将介绍如何让人工客服与您的用户对话。
4. 以人工客服的身份收发消息
你已加入对话,是时候以人工客服的身份发送一些消息了。
进入 step-3
目录,然后重新部署应用。在 CRM 中,点击上一步中的对话会话。现在,您应该会看到一个基本的聊天界面。在这里,您可以实时查看用户的消息。
不过,在代理的情况下发送消息尚未实现。您需要在此步骤中完成这项操作。
打开 routes/index.js
文件并查看新添加的三个端点:
/messages
:获取messages.ejs
视图文件并在浏览器中渲染它。从索引中点击某个会话会话后,系统会将您转到上述某个页面。/retrieveMessages
:获取会话中的邮件/消息内容,并返回会话中所有邮件的格式化列表。消息页面会定期调用此端点以显示最新消息。/sendMessage
:使用人工客服代表向用户发送消息。当您点击“发送”时,消息页面会调用此操作。该解决方案目前尚未实现。
现在,我们来看看现有的 storeAndSendResponse
方法:
step-3/routes/index.js
/**
* Updates the thread, adds a new message and sends a response to the user.
*
* @param {string} message The message content that was received.
* @param {string} conversationId The unique id for this user and agent.
* @param {string} threadState Represents who is managing the conversation for the CRM.
* @param {string} representativeType The representative sending the message, BOT or HUMAN.
*/
async function storeAndSendResponse(message, conversationId, threadState, representativeType) {
...
}
网络钩子已经使用此方法从 echo 聊天机器人发送响应。该方法首先将传入的消息数据存储在对话的 Cloud Datastore 对象中。然后,它会发送响应消息。请仔细查看它创建的消息对象,尤其是代表性类型。
现在,自行实现 /sendMessage
端点。您可以使用此处现有的 storeAndSendResponse
方法完成大部分工作。请务必注意设置正确的代表。
完成上述操作后,重新部署应用,并返回到 CRM 中的对话。你现在可以在聊天记录中看到你的消息。您还可以在移动测试设备上看到代理的消息。
在继续操作之前,请确保您了解新端点的工作原理。在下一步中,您将添加自己的端点以退出对话。
5. 退出对话
在您帮助用户解答问题后,您可能需要退出对话,让用户再次与聊天机器人对话。在 Business Messages 中,此变化由 REPRESENTATIVE_LEFT
事件发出。
前往 step-4
目录,重新部署应用,然后返回到对话线程。现在,会话底部提供了关闭并退出会话链接。此链接尚未生效,因为 leaveConversation
端点未实现。
查看 index.js
文件。有一条 TODO 注释,指示您创建新的 leaveConversation
端点。
step-4/routes/index.js
/*
* TODO: Create a '/leaveConversation' endpoint that does the following:
* - Updates the thread to BOT_THREAD_STATE.
* - Sends a REPRESENTATIVE_LEFT event.
* - Sends a message to the thread informing the user that they are speaking to the echo bot again.
*
* Hint: You can use the same methods that '/joinConversation' uses.
*/
若要实现此目标,您需要将到目前为止从此 Codelab 学到的所有内容进行整合。此端点应执行以下操作:
- 将线程更新为
BOT_THREAD_STATE
。 - 发送
REPRESENTATIVE_LEFT
事件。 - 在对话中发送消息,告诉用户他们正在与 echo 聊天机器人对话。使用
storeAndSendResponse
方法。请注意,客服代表已改回BOT
。
最后一步为用户阐明对话的状态。销售代表退出聊天后,用户会看到某个事件,但不一定知道自己在与 echo 聊天机器人对话。通过直接从聊天机器人发送消息,您可以减少用户的困惑并改善体验。
由于聊天机器人已经开始处理问题,您的人工客服可以自由加入其他对话。请尽情试用示例代码和 CRM。不妨测试一下您对企业实时客服人员转接体验的想法,看看您能想到什么。
6. 即将完成
恭喜您完成实时代理转移 Codelab!
您已创建可以处理从头到尾的人工客服接送事宜的代理。您还学习了一种跟踪与 Cloud Datastore 对话状态的方法。
通过人工客服转接功能,您可以将常见请求留给聊天机器人,而人工客服可以处理更复杂的咨询。您的用户将对新的个性化和实用体验更加满意,从而提高了他们再次访问您的商家并向朋友推荐您的商家的可能性。
后续操作
查看以下 Codelab:
深入阅读
- 参阅“从聊天机器人移交到人工客服”指南,了解有关人工客服转接的基础知识。
- 按照 Dialogflow 指南,将您的 echo 聊天机器人升级为 FAQ 聊天机器人。