1. 准备工作
本自学式 Codelab 将引导您使用 Google Cloud 的 Vertex AI Agent Builder 构建 AI 智能体。每个步骤都会重点介绍一项特定的 Agent Builder 功能，并说明其用途。
前提条件
- 对 Google Cloud 上的生成式 AI 有基本的了解
- 对 AI 客服人员概念有基本的了解
- 对 Gemini CodeAssist 有基本的了解（可选）
学习内容
- 如何使用 Vertex AI Agent Builder 创建简单的 AI 客服
- 如何通过附加数据存储区来将创建的代理置于正规化状态
- 如何将 AI 客服人员集成到您的网站（可选）
所需条件
- 好奇心
- 一台可正常运行的计算机和稳定的 Wi-Fi 连接
- 已关联结算信息的 Google Cloud 项目。
注意：如果您还没有 Google Cloud 项目，可以按照相关说明创建一个。您还可以查看 Google Cloud 免费层级服务。
2. 设计您的首个 AI 智能体
现在，您可以创建自己的 AI 客服人员了。不过，在深入开发之前，请务必为您的聊天机器人制定清晰的愿景。请问自己以下关键问题：
- 它将解决哪些问题？它能否自动执行任务、提供信息、提供娱乐内容或促进创意探索？
- 其主要功能是什么？它将执行任务还是委托任务？它会生成文本，还是会生成不同媒体的组合？
- 有何限制？它能否自主完成所有操作？
- 它应该具有怎样的个性或角色？它是正式的、非正式的、幽默的、实用的还是信息丰富的？
- 使用哪些指标来衡量效果？您将如何衡量代理的效果？
为加快流程，请参阅以下针对您今天要创建的旅行社的相关问题的回答：
- 它将解决哪些问题？
- 规划行程既耗时又繁琐。此旅行社可帮助用户探索目的地、规划行程、预订机票和住宿。
- 其主要功能是什么？
- 代理应能够
- 回答与目的地相关的问题，例如签证要求
- 规划符合用户时间表和目标的行程
- 预订机票和住宿
- 有何限制？
- 默认情况下，客服人员可能无法回答复杂的查询
- 客服人员将无法生成可视图片
- 客服人员的知识将受底层模型的限制
- 它应该具有怎样的个性或角色？
- 此客服人员应对旅行知识丰富、乐于助人且充满热情。应能够清晰简洁地传达信息。
- 使用哪些指标来衡量效果？
- 此代理的成效可以通过用户对其推荐内容（探索、规划、预订）的满意度来衡量
3. 使用 Vertex AI Agent Builder 构建 AI 智能体
借助 Vertex AI Agent Builder，您只需几个步骤即可创建 AI 客服。
第 1 步：
- 前往 Vertex AI Agent Builder。
- 您应该会看到欢迎页面。
- 点击 CONTINUE AND ACTIVATE THE API 按钮。
第 2 步：
- 系统会将您重定向到“创建应用”页面。
- 点击 CREATE A NEW APP 按钮。
第 3 步：
- 选择对话式客服人员，然后点击创建
注意：
- 点击创建后，系统会打开一个名为 Dialogflow 对话式代理的新标签页。
- 如果系统要求您选择 Google Cloud 项目，请选择与您的正确的 Gmail 账号关联的 Google Cloud 项目。
- 如果您是在新账号中进行此实验，系统会要求您启用 Dialogflow API，请点击启用 API 进行启用。
- 如果点击该按钮不起作用，您可以直接前往 API 页面 手动启用该 API。
- 在新打开的 Dialogflow 页面中，点击创建代理
- 现在，系统会显示一些创建代理的选项，请选择自行构建。
第 4 步：
- 选择显示名称（例如“旅行伴侣”）
- 在“位置”中，选择全球（全球服务，静态数据在美国）作为区域
- 保留其他配置（默认）
- 点击创建按钮
第 5 步：
- 选择 Playbook 名称（例如“信息代理”）
- 添加目标（例如，帮助客户解答与旅行相关的问题）
- 定义指令（例如 - 问候用户，然后询问他们需要怎样的帮助）
- 完成所有操作后，按 Save（保存）
第 6 步：
- 点击切换模拟器图标
- 选择您刚刚创建的代理（例如 Info Agent）
- 为您的代理选择底层生成式 AI 模型（例如 gemini-1.5-flash）
- 与您的聊天机器人对话（即在“输入用户输入内容”文本框中输入内容）来测试聊天机器人
恭喜！您刚刚成功使用 Vertex AI Agent Builder 创建了 AI 客服。
4. 将数据存储区附加到代理
尝试向客服人员询问如何前往瓦坎达（例如，“前往瓦坎达的最佳方式是什么？”），您会收到如下回复：
虽然这在事实上是正确的，但如果客服人员仅说“我无法提供信息”并结束对话，不如建议类似地点，对用户更有帮助。这种方法可能会促使用户实际通过代理预订行程。
为了让客服人员推荐类似的地点，您可以通过数据存储区向客服人员提供更多信息。如果代理无法根据其内置知识回答用户问题，则可以将其用作额外的知识库。
注意：如需关闭模拟器，请再次点击切换模拟器图标
创建数据存储区非常简单，只需点击“Agent 基础知识”页面底部的 + 数据存储区按钮即可。
填写以下信息：
- 工具名称：备用营业地点
- 类型：数据存储区
- 说明：如果用户的请求包含不存在的位置，请使用此工具
完成后，请点击保存。
这会创建一个数据存储工具，供代理与数据存储区进行通信，但您仍然需要创建包含相应信息的实际数据存储区。为此，请点击添加数据存储区并创建数据存储区。
点击创建新的数据存储区后，您会被重定向到 Vertex AI Agent Builder 页面，如下所示
选择“Cloud Storage”选项
完成此步骤后，
- 点击文件（这一点非常重要，否则导入将会失败）
- 类型 ai-workshops/agents/data/wakanda.txt
- 点击继续
下面是提供的文本文件的内容，供您参考：
Places that are similar to Wakanda
- Oribi Gorge in South Africa: The rock formations here are reminiscent of the Warrior Falls in Wakanda.
- Iguazu Falls: Located on the border of Argentina and Brazil, these massive waterfalls were a major inspiration for the Warrior Falls.
- Immerse yourself in Wakandan culture: Read the Black Panther comics, watch the movies, and explore online resources to learn more about Wakandan culture, language, and technology.
- Visit a Disney theme park: While there isn't a dedicated Wakanda land yet, you might be able to meet Black Panther at Disneyland or on a Marvel Day at Sea Disney cruise.
在下一页上，为数据存储区命名（例如“Wakanda Alternative”），然后点击创建。
最后一步，选择您刚刚创建的数据源，然后点击创建。您可以点击数据存储区查看数据存储区导入进度。**
注意：导入活动需要一些时间才能成功完成，在此期间，您可以点击此处探索适用于 Vertex AI 智能体的更多数据存储区选项
如果一切顺利，请返回到 dialogflow 标签页，然后点击刷新，您应该会在可用数据存储区页面下看到创建的数据存储区。
为防止 Agent 产生幻觉，请在数据存储区的基准配置中将此设置设为非常低，以对 Agent 施加更严格的限制，防止其胡编乱造。目前，请将其保持为默认设置，但您随时可以尝试使用其他设置。
现在，选择添加的数据存储区，点击确认，然后点击保存。
现在，返回到代理基础知识页面，您会在 Playbook 配置底部看到新创建的数据存储区（例如“备用位置”）可供使用，选中“数据存储区”（例如“备用位置”），然后点击页面顶部的“保存”按钮。
即将大功告成！最后一步是在客服人员的说明中添加“备选营业地点”工具。在客服人员的说明中添加以下行：- 如果用户的请求包含不存在的位置，请使用 ${TOOL: 备选位置}，然后点击保存。
一切准备就绪。我们再打开切换开关模拟器，并询问相同的问题（例如“前往瓦坎达的最佳方式是什么？”）
恭喜！您的智能助理现在会使用文本文件中提供的信息推荐地点。
至此，我们已经完成了构建自己的聊天机器人构建工具 AI 聊天机器人。如果您想详细了解如何自定义聊天机器人以获得更好的体验，请查看下面的“其他活动”。
5. 其他活动 - 让您的 AI 代理上线
在前面的步骤中，您开发了 AI 代理，并使用相关参考数据对其进行了训练。在下一部分中，您将解决一个关键问题，即如何将此代理嵌入您的网站，以便与访问者进行实时互动。
您可以通过多种方式公开您的代理。您可以导出该报告，也可以直接发布该报告。您可以浏览文档，了解可能的选项。
在 Dialogflow 标签页的右上角，依次点击菜单和发布客服人员
将所有配置都保留为默认，然后点击启用未经身份验证的 API。
注意：启用未经身份验证的 API 仅用于演示目的，不建议将此配置用于生产工作负载。如果您有兴趣以安全的方式发布，请参阅此文档。
点击后，您应该会看到一段 CSS 代码段：
只需复制代码段即可。您稍后将将此代码段集成到网站中。
如需创建网站，您将使用 Cloud Editor 环境。以下是打开 Cloud Editor 的步骤：
- 在另一个标签页中打开 Google Cloud 控制台。
- 点击右上角的“激活 Cloud Shell”按钮
- 点击打开编辑器按钮。
如果系统提示您授权 Cloud Shell，请点击授权以继续。
在下一部分中，您将使用 Gemini Code Assist 创建一个 Python Flask Web 应用示例，以便与您的 Agent 代码段集成。
打开 Cloud Shell 编辑器后，点击 Gemini Code Assist，然后登录您的 Google Cloud 项目。如果系统要求您启用该 API，请点击启用。
完成后，我们让 Gemini Code Assist 创建一个 Flask 应用，并将 AI 代理代码段集成到其中。
以下是示例提示，您可以使用
Here is my Travel buddy Vertex AI agent builder agent publish code snippet,
<REPLACE IT WITH YOUR AI AGENT PUBLISH CODE SNIPPET>
can you create a sample flask app to use it
注意：在这里，我们要求使用 Python Flask 应用。如果您更喜欢使用任何其他编程语言或框架，请随意使用。Gemini Code Assist 能够生成不同的编程语言。如需了解详情，请参阅支持的语言、IDE 和接口。
您会看到，提供的代码段已与 AI 客服人员集成。如需测试所提供的代码是否有效且能否按预期运行，您可以按照 Gemini Code Assist 提供的有关如何运行输出响应中此代码段的说明操作。
示例输出响应代码段 -
from flask import Flask, render_template_string
app = Flask(__name__)
# HTML template string with the provided Dialogflow Messenger code
html_template = """
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Travel Buddy Chatbot</title>
<link rel="stylesheet" href="https://www.gstatic.com/dialogflow-console/fast/df-messenger/prod/v1/themes/df-messenger-default.css">
<script src="https://www.gstatic.com/dialogflow-console/fast/df-messenger/prod/v1/df-messenger.js"></script>
<style>
df-messenger {
z-index: 999;
position: fixed;
--df-messenger-font-color: #000;
--df-messenger-font-family: Google Sans;
--df-messenger-chat-background: #f3f6fc;
--df-messenger-message-user-background: #d3e3fd;
--df-messenger-message-bot-background: #fff;
bottom: 16px;
right: 16px;
}
body {
font-family: sans-serif;
margin: 20px;
}
</style>
</head>
<body>
<h1>Welcome to Travel Buddy!</h1>
<p>Start chatting with our AI Travel buddy, in the bottom right corner.</p>
<df-messenger
project-id="<SAMPLE>"
agent-id="<SAMPLE>"
language-code="en"
max-query-length="-1">
<df-messenger-chat-bubble
chat-title="Travel Buddy">
</df-messenger-chat-bubble>
</df-messenger>
</body>
</html>
"""
@app.route("/")
def index():
"""Renders the HTML template with the Dialogflow Messenger."""
return render_template_string(html_template)
if __name__ == "__main__":
app.run(debug=True)
根据给定说明
- 复制所提供的示例 Flask 应用代码段，
- 创建一个名为 app.py 的新文件，然后保存该文件。
在下一步中，系统会要求您安装 Flask 才能运行此代码段，但目前不需要这样做，因为 Cloud Shell 默认已安装所有常用实用程序。
保存文件（Ctrl + S 或 Cmd + S），然后点击打开终端，在其中运行所提供的代码。
在终端中，运行以下命令
python app.py
注意：请确保您位于包含 app.py 文件的正确文件夹中
Python flask 应用将在端口 5000 上运行。如需查看此 Web 应用的预览，请点击 Cloud Shell 中的 Web Preview 图标。然后，您可以点击更改端口，输入 5000，然后点击更改并预览进行保存。
系统随即会显示一个示例网站，并且 AI 客服人员已随时待命。只需点击 AI 客服人员，即可开始与其聊天。
您可以随意使用不同的提示进行测试。您还可以让 Gemini Code Assist 美化您的网站，或者向 AI 助理添加更多基础数据，让其更具实用价值。
准备就绪后，您可以尝试在 Google Cloud 上托管此 AI 代理，以便任何人都可以随时随地访问它。在本 Codelab 的其余部分中，您将将此示例 Flask 应用作为容器部署到 Cloud Run。
注意：这不仅限于 Cloud Run（如果您不知道 Cloud Run 是什么，也可以提出这个问题），您可以让 Gemini Code Assist 帮助您按照最佳实践在 Google Cloud 或任何其他位置部署此应用，它也可以帮助您完成这部分工作。
返回 Cloud Shell 终端，然后按 Ctrl + C 终止进程。再次点击 Open Editor（打开编辑器），让 Gemini Code Assist 帮助我们将应用容器化并部署到 Cloud Run。
Can you help me deploy this sample flask app to cloud run service
它提供了一些说明和命令，可供我们按照这些说明在 Cloud Run 服务中托管应用，我们来按照这些说明操作
以下是输出响应示例
部署到 Cloud Run 的步骤
- 前提条件：
- Google Cloud 账号：您需要拥有一个已启用结算功能的 Google Cloud 账号。
- gcloud CLI：在本地机器上安装并初始化 Google Cloud SDK (gcloud CLI)。您将使用它从终端与 Google Cloud 进行交互。
- Docker：在本地机器上安装 Docker。Cloud Run 使用 Docker 容器化您的应用。
- 项目设置：确保您已在 gcloud CLI 中选择一个 Google Cloud 项目。您可以使用
gcloud config list project进行检查，并使用gcloud config set project YOUR_PROJECT_ID进行设置
注意：由于我们将在 Cloud Shell 中执行此整个活动，因此无需设置项目
- 创建 **
requirements.txt****:**
- 此文件列出了您的应用所需的所有 Python 软件包。在项目目录（
main.py所在的位置）中，创建一个名为requirements.txt的文件，并添加以下代码行
- 创建 **
Dockerfile****:**
Dockerfile用于定义如何为应用构建 Docker 映像。在项目目录中创建一个名为Dockerfile（无扩展名）的文件，并添加以下内容：
# Use an official Python runtime as a parent imageFROM python:3.9-slim-buster
# Set the working directory to /appWORKDIR /app
# Copy the current directory contents into the container at /app
COPY . /app
# Install any needed packages specified in requirements.txt
RUN pip install --no-cache-dir -r requirements.txt
# Make port 5000 available to the world outside this container
EXPOSE 5000
# Define environment variable
ENV NAME World
# Run app.py when the container launches
CMD ["python", ".py"]
- 构建 Docker 映像：
- 打开终端，导航到项目目录，然后运行以下命令：
gcloud builds submit –tag gcr.io/bgr-workshop-23rd/travel-buddy
- 部署到 Cloud Run：
- 构建并上传映像后，使用以下命令将其部署到 Cloud Run：
gcloud run deploy travel-buddy --image gcr.io/bgr-workshop-23rd/travel-buddy --region us-central1
完成这些步骤后，您将看到集成了 AI 客服人员的应用已面向最终用户发布。
恭喜，祝您学习愉快。
6. 清理
为避免系统因本 Codelab 中使用的资源向您的 Google Cloud 账号收取费用，请按照以下步骤操作：