此页面由 Cloud Translation API 翻译。

在线购买门店自提：Bonjour Meal - 第 1 部分 - 使用入门

1. 简介

上次更新时间：2022 年 5 月 11 日

欢迎使用 Business Messages！

本 Codelab 简要介绍了如何与商家信息集成。借助商家信息，客户可以通过 Google 搜索和 Google 地图与您管理的商家建立联系。您可能是希望直接与 Business Messages 集成的企业，也可能是在独立软件供应商处工作，为合作企业构建消息解决方案，或者您只是偶然发现了 Business Messages，并希望对该平台进行调整。

无论您是出于何种原因而来到这里，此 Codelab 都是一个绝佳的入门方式。完成后，您将拥有第一个可供用户互动的数字客服人员。经过进一步优化，当您准备好在商家信息中发布消息后，您将有可能覆盖数百万客户。

怎样才算是优秀的数字代理？

商家信息是一个对话界面，可在移动设备上提供类似应用的体验，让消费者无需安装额外的应用即可与商家联系。数字客服人员是客户与之互动的逻辑部分。该逻辑由部署在云端或基础架构中的 Web 应用管理。如何回复用户完全由您自行决定。优秀的客服人员会提供背景信息来设定预期、保持客户互动度，并提供功能来满足用户需求。

构建内容

在此 Codelab 中，您将在 Business Messages 上为名为 Bonjour Meal 的虚构公司构建一个数字代理。此数字客服人员会回答一些简单的问题，例如“你们几点打烊？”或“我可以通过线上购买吗？”。

在此 Codelab 中，您的用户将能够通过数字代理购买商品，将用户引导至付款处理方收款，然后安排在实体店内自提虚构商品。

在本 Codelab 中，您的应用将实现下列功能：

通过建议条状标签回答问题
引导用户提出您的数字客服人员可以回答的问题
提供丰富的对话功能，让用户保持对对话的兴趣

学习内容

如何在 Google Cloud Platform 中的 App Engine 上部署 Web 应用。或者，您也可以使用 ngrok 公开测试本地应用。
如何使用 Web 应用 webhook 配置您的 Business Messages 账号，以接收用户发来的消息
如何使用 Business Messages API 发送卡片、轮播界面和对话式建议等丰富功能
商家信息如何发送消息

本 Codelab 主要介绍如何构建您的第一个数字代理。

所需条件

注册免费的企业通讯开发者账号
访问我们的开发者网站，获取相关说明
搭载 Android 5 或更高版本的 Android 设备，或搭载 iOS 10 或更高版本且安装了 Google 地图应用的 iOS 设备
具有 Web 应用编程方面的经验
已连接到互联网！

2. 准备工作

启用 API

在本 Codelab 中，由于我们要使用 Django 应用，因此将依赖 Cloud Build API 将应用部署到 App Engine。或者，如果您使用的是 ngrok，则无需启用 Cloud Build API。

如需启用 Cloud Build API，请执行以下操作：

在 Google Cloud 控制台中打开 Cloud Build API。
点击启用。

创建服务账号

您需要创建一个服务账号才能访问 Business Communications API 和 Business Messages API。按照文档中的步骤在商务沟通开发者控制台中创建服务账号。

部署 Django Python EchoBot 起始代码

在终端中，使用以下命令将 Django Echo Bot 代码示例克隆到项目的工作目录中：

$ git clone https://github.com/google-business-communications/bm-bonjour-meal-django-starter-code

将为相应服务账号创建的 JSON 凭据文件复制到示例的“resources”文件夹中，并将这些凭据重命名为“bm-agent-service-account-credentials.json”。

bm-bonjour-meal-django-starter-code/bonjourmeal-codelab/step-1/resources/bm-agent-service-account-credentials.json

在终端中，导航到示例的“step-1”目录。

在终端中运行以下命令以部署示例：

$ gcloud config set project PROJECT_ID*
$ gcloud app create
$ gcloud app deploy

PROJECT_ID 是您用于向相应 API 注册的项目的 ID。

请记下最后一个命令输出的内容中已部署应用的网址：

Deployed service [default] to [https://PROJECT_ID.appspot.com]

您刚刚部署的起始代码包含一个 Web 应用，该应用具有用于从 Business Messages 接收消息的 webhook。应用会将消息回传给用户，并可以展示对话界面中提供的一些丰富功能。

配置您的网站

现在，您的服务已部署完毕，您将使用应用的网址在商务沟通开发者控制台的账号设置页面中设置 webhook 网址。

webhook 网址将是应用的网址 +“/callback/”。例如，该网址可能如下所示：https://PROJECT_ID.appspot.com/callback/

前往商务沟通控制台的账号设置页面。在右上角的导航栏下方，您应该会看到自己的 GCP 项目名称。如果您看到下拉列表，请务必选择您的 GCP 项目。

填写技术联系人详细信息，然后使用已部署应用的网络钩子网址更新网络钩子。

点击 GCP 项目引用旁边的保存。

3. 创建您的第一个代理

使用 Business Communications 开发者控制台

在商务通信控制台中，点击左上角的徽标返回控制台信息中心，然后点击创建客服人员。您可以在创建客服人员时创建品牌。为代理类型选择 Business Messages，并确保合作伙伴信息正确无误。

在品牌中，输入您要创建的品牌的名称。品牌是指您合作的商家，消费者可以与代理进行对话互动。在代理名称中，指定您希望用户在 Business Messages 对话中看到的内容。在虚构的 Bonjour Meal 示例中，Bonjour Rail 是负责管理 Bonjour Meal 餐厅的铁路公司。因此，我将 Bonjour Rail 指定为品牌，Bonjour Meal 指定为代理。

代理是代表品牌的对话实体。

点击创建代理，让控制台发挥魔力。此请求需要几秒钟的时间，才能向 Business Communications API 发出多个请求来创建品牌和代理。您可以直接使用 Business Communications API 创建代理和品牌。请参阅文档，了解 curl 请求如何执行与控制台执行的相同操作。

进行首次对话

打开您刚刚创建的客服人员，您会看到概览页面，您可以在此页面开始查看客服人员的详细信息。查看代理的测试网址。这些网址用于在您的设备上调用对话式途径。

您可以点击任一条条状标签来复制测试网址。当然，请复制您手边的设备的测试网址以进行测试。您可以通过任何方式将复制的这条消息发送到您的设备。

在移动设备上，点按该链接会调用 Business Messages 客服人员启动器，其中会预先填充您的客服人员测试网址。

点按启动以调用客服人员的对话界面。

与客服人员互动，了解其功能。在大多数情况下，您会发现对话界面只会重复您的消息。向其发送“Hello, World!”之类的消息，您会发现客服人员会将相同的消息发回给您。

部署的应用还包含一些逻辑，用于展示商家消息提供的丰富功能。

如果您发送“card”，则会调用复合信息卡
如果您发送“条状标签”，则会调用建议内容信息卡
如果您发送“轮播界面”，则会调用一组复合信息卡的轮播界面

恭喜！这是您的客服人员与您进行的首次对话！

每种丰富功能都可以用于向与您的客服人员沟通的用户提供更好的背景信息。在富媒体卡片中发送图形素材资源，以更好地传达想法，或使用建议条状标签引导对话。

更新欢迎辞和使用对话条状标签

我们来使用一下开发者控制台，了解如何修改客服人员的欢迎消息，以及如何利用建议条状标签来帮助用户沟通。

前往代理的概览页面，然后选择代理信息。向下滚动到“欢迎辞和对话开场白”部分。

将欢迎消息（黄色输入字段）更新为：

欢迎使用 Bonjour Meal 启动器客服人员。我可以重复您的消息，并向您展示该平台支持的一些丰富功能，请尝试这些建议！

点击上图紫色框中所示的 + 添加对话开场白，以添加对话开场白来调用建议条状标签、轮播界面和卡片。您添加的对话启动器需要包含文本组件和 postbackData 组件。文本是向用户显示的内容，而回传数据是发送到代理的 webhook 的内容。该 webhook 会解析回传数据，并将适当的响应发送给用户。

修改后，控制台中的代理信息将如下所示：

您可以在控制台右侧预览客服人员的外观。请注意，欢迎消息如何反映您刚刚更改的内容以及下方的建议条状标签。

这是一个非常有用的工具，可帮助您大致了解用户体验。您可以在构建聊天机器人和规划要支持的用户历程时使用它。

很抱歉，由于之前的数据会缓存在商家信息基础架构中，因此这些更改不会立即反映在对话中。缓存大约每 2 小时清除一次，因此您应该可以在明天尝试一下。

与此同时，我们来看看所有这些功能的底层运作方式。

4. 分析起始代码

源代码的宏观视图

您部署的起始代码会将消息回传给用户，并可以显示富媒体卡片、轮播界面或建议条状标签。我们来深入了解一下源代码，以便了解其运作方式。然后，我们会确定需要做出哪些更改。

起始代码是一个 Django 项目。在本 Codelab 系列的后续部分，我们将使用 Google Datastore 保留购物车和相关对话等数据。如果您之前从未使用过 Django，请不要担心，它非常简单，在本 Codelab 结束时，您将了解它的运作方式。

概括来讲，Django 会将网址路由到视图，而视图逻辑会生成在浏览器中呈现的模板。我们来看看项目的 urls.py。

bm-django-echo-bot/bmcodelab/urls.py [第 31-37 行]

from django.urls import include, path
import bopis.views as bopis_views

urlpatterns = [
    path('', bopis_views.landing_placeholder),
    path('callback/', bopis_views.callback),
]

此处定义了两个路由，因此如果 Django 识别到这两个网址，便会执行逻辑。假设项目网址为 https://PROJECT_ID.appspot.com/，则该项目知道的路由如下：

https://PROJECT_ID.appspot.com/
https://PROJECT_ID.appspot.com/callback/

这两个网址路线都引用了来自 bopis/views.py 的 bopis_views。我们来看看这个文件中发生了什么。首先，我们来了解一下 bopis_views.landing_placeholder。

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [第 302-309 行]

... 
def landing_placeholder(request):
    return HttpResponse("<h1>Welcome to the Bonjour Meal Codelab</h1>
    <br/><br/>
    To message your Bonjour Meal agent, go to the Developer Console and retrieve
    the Test URLs for the agent you have created as described in the codelab
    <a href='https://codelabs.developers.google.com/codelabs/'>here</a>.")
...

当网络服务器收到指向项目根目录的 Web 请求时，会执行这段逻辑。这里没有什么特别复杂的操作：我们只需将包含一些 HTML 的 HTTPResponse 返回给发出请求的浏览器即可。因此，您确实可以打开项目的根网址，但在那里没有太多可做的事情，因为它会将您带回此 Codelab。

另一个网址会路由到名为 callback 的函数（也位于 bopis/views.py 中）。我们来看看这个函数。

bm-django-echo-bot/bopis/views.py [第 60-101 行]

...
def callback(request):
    """
    Callback URL. Processes messages sent from user.
    """
    if request.method == "POST":
        request_data = request.body.decode('utf8').replace("'", '"')
        request_body = json.loads(request_data)

        print('request_body: %s', request_body)

        # Extract the conversation id and message text
        conversation_id = request_body.get('conversationId')
        print('conversation_id: %s', conversation_id)

        # Check that the message and text body exist

        if 'message' in request_body and 'text' in request_body['message']:
            message = request_body['message']['text']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'suggestionResponse' in request_body:
            message = request_body['suggestionResponse']['postbackData']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'userStatus' in request_body:
            if 'isTyping' in request_body['userStatus']:
                print('User is typing')
            elif 'requestedLiveAgent' in request_body['userStatus']:
                print('User requested transfer to live agent')

        return HttpResponse("Response.")

    elif request.method == "GET":
        return HttpResponse("This webhook expects a POST request.")
...

此处的逻辑会解析 message 或 suggestionResponse 的请求正文，并将这些信息传递给名为 route_message 的函数，然后将 HttpResponse 返回给商家信息基础架构，以确认收到消息。

这是一个重要的功能。这段逻辑是 Web 应用的 webhook，用于接收与您的客服人员互动的用户发送的消息。您可以扩展 webhook，以向 Dialogflow 等自动化工具发送消息，以了解用户可能在说什么，并根据推理结果生成回复。您还可以转发消息，以便用户与实时客服人员联系。请参阅下图：

商家信息会将消息内容作为 JSON 载荷发送到您的 webhook，然后 webhook 会将其路由到人工客服人员或某种逻辑，以便作为聊天机器人进行回复。在本例中，该路由机制为 route_message。一起来看看吧

bm-django-echo-bot/bopis/views.py [105-122 行]

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    else:
        echo_message(message, conversation_id)
...

这段逻辑会开始检查用户收到的消息。首先，系统会通过将所有字符都转换为小写来对消息进行归一化处理。归一化后，它会检查消息是否为文件顶部定义的任何常量。

bm-django-echo-bot/bopis/views.py [第 40-42 行]

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
...

也就是说，聊天机器人会解析特定地包含我们在此 Codelab 上一步中放入对话启动器的 postback_data 中的任何字符串的消息。如果没有显示任何字符串，则它会将消息传递给一个名为 echo_message 的函数，您可以想象一下，该函数会回传消息。

发送消息

至此，您应该已经了解 Web 应用如何接收消息。所有这些都是由该网络钩子完成的。

但应用如何使用 Business Messages 向用户发送出站消息？

当您的基础架构响应用户时，您需要将响应发送到 Business Messages API，后者会将消息传送给用户。

Business Messages API 提供了 Python、Node.js 和 Java 库。如果您的基础架构使用的语言不支持我们的库，您还可以使用 REST API 直接发出请求。请参阅发送消息，了解如何使用 c网址向特定对话 ID 发送消息。

在本 Codelab 中，我们将重点介绍已集成到 Bonjour Meal 起始代码中的 Python 客户端库。该代码已部署到 GCP 项目中的 App Engine，或通过 ngrok 在本地运行。

我们来看看 echo_message 函数，了解如何与 API 交互以将消息发送到 Business Messages。

bm-django-echo-bot/bopis/views.py [第 199-212 行]

...
def echo_message(message, conversation_id):
    '''
    Sends the message received from the user back to the user.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

在此函数中，系统会使用传入 echo_message 函数的消息变量实例化 BusinessMessagesMessage。实例化后，该对象会随对话 ID 一起传递给 send_message。

bm-django-echo-bot/bopis/views.py [214-236 行]

...
def send_message(message, conversation_id):
    '''
    Posts a message to the Business Messages API, first sending
    a typing indicator event and sending a stop typing event after
    the message has been sent.

    Args:
        message (obj): The message object payload to send to the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    credentials = ServiceAccountCredentials.from_json_keyfile_name(
        SERVICE_ACCOUNT_LOCATION,
        scopes=['https://www.googleapis.com/auth/businessmessages'])

    client = bm_client.BusinessmessagesV1(credentials=credentials)

    # Create the message request
    create_request = BusinessmessagesConversationsMessagesCreateRequest(
        businessMessagesMessage=message,
        parent='conversations/' + conversation_id)

    bm_client.BusinessmessagesV1.ConversationsMessagesService(
        client=client).Create(request=create_request)
...

send_message 函数只会使用您的服务账号凭据验证您是否可以向此对话发送消息，实例化一个 Business Messages 客户端，并创建一个请求以将消息发送到给定的 conversation ID。

富媒体功能也会使用此 send_message 函数，但它们创建的消息仅适用于复合信息卡、轮播界面和建议条状标签。富媒体卡片和轮播界面可以包含图形素材资源，而建议条状标签包含 postback_data，以便回调逻辑可以正确解析它。

现在，我们已经了解了如何发送消息，接下来研究一下示例如何发送复杂卡片、轮播界面和建议条状标签。在下一部分中，我们将修改源代码，以便发送包含其中一些丰富功能的消息。

准备就绪后，我们来自定义 Bonjour Meal 客服人员。

5. 自定义智能体

如果您到目前为止一直跟着此 Codelab 操作，应该会看到我们漂亮的客服人员。

好的，效果不是很好，看起来有点空洞，不能很好地代表我们的业务。幸运的是，我们对支持客服助理的代码有基本的了解，并且拥有所需的工具，可以按照自己的意愿以任何方式自定义客服助理。

在此 Codelab 的其余部分中，我们将使用以下内容扩展该代理：

添加实际徽标
改进了欢迎消息
提供营业时间信息
告知用户，线上购买商品功能即将推出
使用对话式建议条状标签来促进对话

我们将利用 Business Communications 控制台来更新徽标和欢迎消息，但您也可以随时直接使用 Business Communications API 来执行此操作。然后，我们必须更新源代码，以发送适当的消息来提供营业时间信息，并告知 Bonjour Meal 即将推出在线购物功能。完成后，我们将返回到商家通信控制台，创建对话建议条状标签，以帮助引导对话走向数字客服支持的理想体验路径。

添加徽标

在 Business Communications 控制台中，选择您的客服人员，然后前往客服人员信息。我们需要更新商家徽标，如下方以黄色标记的部分所示。

点击上传，然后选择要上传的图片或要从网址导入的图片。

请参阅文档中的徽标设计准则，了解我们建议的使用自有徽标的最佳实践。

我们来上传您在此 Codelab 开头部分克隆的源代码中的徽标。您可以在代码库的 ./assets/ 目录中找到它，该文件名为“bonjour_meal-logo.png”。您可以将文件拖动到网络浏览器上的模态中，系统会显示一款轻量编辑工具，用于调整图片质量和剪裁。调整图片分辨率并进行剪裁，使图片不超过 50KB 的限制。获得满意的图片后，点击蓝色圆圈中的对勾标记进行确认，然后点击模态窗口底部的选择。

最后，点击客服人员信息页面右上角的保存。此更改需要一段时间才能反映在您的设备上，因为代理信息会缓存在我们的服务器中，并且应该会在更改后的 2 小时内显示。

更新欢迎消息

我们在本 Codelab 的早些部分已经更新了欢迎消息。我们再来做一次，但这次配置一个更适合 Bonjour Meal 用户体验历程的欢迎消息。

在商家通讯控制台中，选择您的客服人员，然后进入客服人员信息。向下滚动，直到看到欢迎消息输入字段，您可以在其中更新消息。

既然我们要添加对话开场白，就可以在欢迎消息中提及它们。在输入字段中，将其替换为以下文本：

“欢迎使用 Bonjour Meal。我是一名助理，可以帮助您解答有关 Bonjour Meal 的疑问。请尝试以下某些选项。”

最后，点击客服人员信息页面右上角的保存。再次提醒一下，由于我们采用了缓存机制来确保系统运行流畅，因此这项更改需要一段时间才能反映到系统中！

提供营业时间信息

为了向用户提供此类信息，我们会使用商家信息 API 向用户发送自定义消息。

您可能还记得，消息是在 views.py 的 route_message 函数中解析的。该函数首先会对字符串进行标准化，然后开始检查标准化消息是否与任何硬编码参数匹配。为简单起见，我们再添加一个条件，用于检查经过归一化处理的消息是否等于一个新常量（我们将其称为 CMD_BUSINESS_HOURS_INQUIRY，并将其值设为“business-hours-inquiry”）。如果条件的求值结果为 true，我们将调用一个名为 send_message_with_business_hours 的函数。

route_message 函数现在将如下所示：

bm-django-echo-bot/bopis/views.py

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    else:
        echo_message(message, conversation_id)
...

为了让代码正常运行，我们还必须进行两项更改；第一项是定义 CMD_BUSINESS_HOURS_INQUIRY 以及其他常量，第二项是实际定义函数 send_message_with_business_hours 并使用商家信息 API 发送消息。

我们先在文件顶部与其他常量声明一起定义常量：

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
...

现在，定义 send_message_with_business_hours。您可以在文件中的任意位置按照适当的 Python 语法定义此函数。由于此函数只是发送消息，与 echo_message 非常相似，因此您可以将其用作模板来定义此函数。

bm-django-echo-bot/bopis/views.py

...
def send_message_with_business_hours(conversation_id):

    message = '''Thanks for contacting us! The hours for the store are:\n
    MON 8am - 8pm\n
    TUE 8am - 8pm\n
    WED 8am - 8pm\n
    THU 8am - 8pm\n
    FRI 8am - 8pm\n
    SAT 8am - 8pm\n
    SUN 8am - 8pm
    '''

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

这样一来，当用户发送以下消息“business-hours-inquiry”时，我们的聊天机器人应该就能回复这些营业时间。您可能会看到如下内容：

将源代码部署到 GCP 后，更改将立即生效。我们在 Google Cloud Platform 中缓存 Web 应用的方式与缓存代理信息的方式不同，因此您可以立即测试此体验。

既然我们已经开始更改源代码，不妨再进行一项修改，让用户能够询问在线购物。您的数字客服人员会回复您，告知您该功能尚不可用，但您可以稍后再回来查看。

告知用户即将推出在线购物功能

我们将进行与告知用户营业时间类似的修改。这次，我们将信息放入富媒体卡片中，并添加富有吸引力的图片。

解析归一化消息，并检查名为 CMD_ONLINE_SHOPPING_INQUIRY 且值设为“online-shopping-inquiry”的常量是否满足条件，如果条件为 true，则调用 send_online_shopping_info_message。

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
CMD_ONLINE_SHOPPING_INQUIRY = 'online-shopping-inquiry'
...
...
...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    elif normalized_message == CMD_ONLINE_SHOPPING_INQUIRY:
        send_online_shopping_info_message(conversation_id)
    else:
        echo_message(message, conversation_id)
...

现在，定义 send_online_shopping_info_message。我们希望以包含图片的富媒体卡片的形式发送此消息，因此请复制 send_rich_card 函数，以用作定义 send_online_shopping_info_message 的模板。

首先，我们应更新回退文本，以显示适当的消息。如果设备因某种原因无法接收富媒体卡片，系统会使用回退文字。接下来，我们应更新 BusinessMessagesRichCard，以添加相关的标题、说明、建议和媒体字段。我们的函数应如下所示：

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
    fallback_text = ('Online shopping will be available soon!')

    rich_card = BusinessMessagesRichCard(
        standaloneCard=BusinessMessagesStandaloneCard(
            cardContent=BusinessMessagesCardContent(
                title='Online shopping info!',
                description='Thanks for your business, we are located in SF near the Golden Gate Bridge. Online shopping is not yet available, please check back with us in a few days.',
                suggestions=[],
                media=BusinessMessagesMedia(
                    height=BusinessMessagesMedia.HeightValueValuesEnum.MEDIUM,
                    contentInfo=BusinessMessagesContentInfo(
                        fileUrl=SAMPLE_IMAGES[4],
                        forceRefresh=False
                    ))
                )))

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        richCard=rich_card,
        fallback=fallback_text)

    send_message(message_obj, conversation_id)
...

棒极了！我们的数字客服人员现在可以回复询问在线购物的用户。目前，我们的数字客服人员尚不支持在线购物，因此我们会向用户发送一条消息，告知他们该功能即将推出。当用户询问有关网购的问题时，我们的数字客服人员会以如下方式呈现。

与我们之前为允许用户查询营业时间而进行的更改一样，如果您使用的是 ngrok，则可以立即看到这项更改；如果您将代码部署到 GCP App Engine，则会在部署后立即看到这项更改。

在下一部分中，我们将使用对话启动器和建议条状标签来引导对话走向理想路径。

使用条状标签引导对话

我们已对一些源代码进行了更改，并部署了更新后的数字客服人员，但我们绝不会要求用户输入“business-hours-inquiry”或“online-shopping-info”来询问商家相关信息。我们来更新对话开场白，以便在用户打开对话时，系统不仅会向用户显示漂亮的欢迎消息，还会显示对话开场白。

前往 Business Communications 控制台，然后访问客服人员的客服人员信息页面。我们之前为“条状标签”“卡片”和“轮播界面”定义了对话启动器。虽然这些功能仍然可用，但与我们的业务功能已不再相关。您可以保留这些内容，继续展示这些丰富的功能，也可以将其移除，让数字客服人员显示专门针对 Bonjour Meal 商家的问题开场白。

我们将创建两个新的对话开场白。对于第一个问题，请将文字设置为“您的营业时间是什么？”，并将回传数据设置为“business-hours-inquiry”。对于第二个对话启动词，请将文本设置为“我可以在这里购物吗？”，并将回传数据设置为“online-shopping-info”。

结果应如下屏幕截图所示的配置：

与在商家通讯管理中心内进行的其他更改一样，此更改需要一些时间才能传播，然后您才能在移动设备上看到所产生的更改。

现在，我们已经完成了对话开场白，接下来还需要一种方法，在对话开始后引导用户走上顺畅的路径。在发送消息后，您可以根据上下文使用条状标签，引导用户使用数字客服助理提供的其他功能。因此，每当用户询问营业时间或在线购物时，我们都会发送一条消息，建议用户与客服人员执行其他操作。

在函数的末尾，添加以下代码：

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Business hours',
                postbackData='business-hours-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

# Let's do the same with the business hours
def send_message_with_business_hours(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Can I purchase online?',
                postbackData='online-shopping-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

请注意，BusinessMessagesSuggestion 中的文本字段不得超过 25 个字符，如文档中所述。

下面是更新后的对话起始词和策略性建议条状标签的预期用户体验的屏幕截图。

6. 恭喜

恭喜，您已成功构建自己的首个 Business Messages 数字客服人员！

您已部署 Web 应用来支持在 Business Messages 上使用数字客服人员，使用了 Business Communications 控制台修改了客服人员，并通过更改源代码来打造数字客服人员的用户体验。

现在，您已了解构建互动式商家信息体验所需的关键步骤，接下来可以大展拳脚了。您可以扩展代理以支持商品目录查询，或引入购物车以跟踪用户可能感兴趣的内容。您可以使用轮播界面展示菜单中的项，并使用建议功能让用户选择他们感兴趣的项。

下面的预览展示了该功能可能的样子。

如何打造出色的对话体验？

效果最佳的客服人员会向用户提供背景信息，同时在对话中为用户提供功能，让用户能够像通过电话或甚至面对面交流一样与商家互动并保持互动度。考虑以下主题可能如何应用于您想要与合作商进行的对话。

提供背景信息并设定预期

提供上下文可以是任何形式，从明确说明您可以如何帮助用户，到为数字客服人员引入用户可以感同身受的角色。在商家信息上取得理想成效的客服人员会使用代表性头像向用户展示他们在与谁交谈。

设定预期取决于您要打造的用户体验。例如，如果您的客服人员支持查询库存，请先告知用户空房可能较少，然后再提供答案。

向用户提供功能

消费者随时随地与商家建立联系。从查看订单状态到确认商品是否有货等咨询，商家信息都可以支持复杂的用户互动。即使商家网站上提供了问题的答案，许多用户仍会通过电话向商家寻求解答。因此，企业必须投入更多资源来应对通话量，尤其是在节假日期间。

保持用户互动度

提供对话接触点，让用户保持对对话的兴趣。在发送消息之间，您可以调用打字指示器，让用户知道您正在为其处理回答。

借助输入指示器、建议内容信息条、富媒体卡片和轮播界面等丰富功能，您可以引导用户获得顺畅的用户体验，帮助他们完成特定任务，例如从菜单中订购商品。目标是减少商家电话线的来电流量。

对话必须向用户提供功能，这一点至关重要。通过消息功能与商家联系的用户希望能快速得到问题的解答。在理想情况下，数字客服人员可以促进对话，但在某些情况下，数字客服人员无法促进对话，这可能会导致用户体验不佳。幸运的是，我们可以通过一些方法来解决此问题，例如将对话转给实时客服人员，我们将在后续的 Codelab 中介绍此方法。

后续操作

完成上述操作后，请查看以下一些主题，了解您可以在商家信息中实现哪些更复杂的互动

在线购买门店自提：Bonjour Meal - 第 1 部分 - 使用入门

1. 简介

欢迎使用 Business Messages！

怎样才算是优秀的数字代理？

构建内容

学习内容

所需条件

2. 准备工作

启用 API

创建服务账号

部署 Django Python EchoBot 起始代码

配置您的网站

3. 创建您的第一个代理

使用 Business Communications 开发者控制台

进行首次对话

更新欢迎辞和使用对话条状标签

4. 分析起始代码

源代码的宏观视图

bm-django-echo-bot/bmcodelab/urls.py [第 31-37 行]

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [第 302-309 行]

bm-django-echo-bot/bopis/views.py [第 60-101 行]

bm-django-echo-bot/bopis/views.py [105-122 行]

bm-django-echo-bot/bopis/views.py [第 40-42 行]

发送消息

bm-django-echo-bot/bopis/views.py [第 199-212 行]

bm-django-echo-bot/bopis/views.py [214-236 行]

5. 自定义智能体

添加徽标

更新欢迎消息

提供营业时间信息

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

告知用户即将推出在线购物功能

bm-django-echo-bot/bopis/views.py

bm-django-echo-bot/bopis/views.py

使用条状标签引导对话

bm-django-echo-bot/bopis/views.py

6. 恭喜

如何打造出色的对话体验？

提供背景信息并设定预期

向用户提供功能

保持用户互动度

后续操作

参考文档