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。
- 您应该会看到欢迎页面。

- 点击继续并激活 API 按钮。
第 2 步:
- 系统会将您重定向到应用创建页面。

- 点击创建新应用按钮。
第 3 步:
- 选择对话式代理,然后点击创建

注意:
- 点击创建后,系统会打开一个新标签页,其中显示 Dialogflow 对话智能体。
- 如果系统要求您选择 Google Cloud 项目,请选择与正确的 Gmail 账号关联的 Google Cloud 项目。
- 如果您是在新账号中完成本实验,系统会要求您启用 Dialogflow API,请点击启用 API 以启用该 API。

- 如果点击该按钮不起作用,您可以直接前往 API 页面 手动启用该 API。
- 在新打开的 Dialogflow 页面中,点击创建代理

- 现在,系统会提供一些用于创建代理的选项,请选择自行构建。

第 4 步:
- 选择显示名称(例如“旅游助手”)
- 对于“位置”,请选择 global (Global serving, data-at-rest in US) 作为区域
- 保留其他配置,默认
- 点击创建按钮

第 5 步:
- 选择 Playbook 名称(例如“信息代理”)
- 添加目标(例如,帮助客户解答与旅游相关的问题)
- 定义一个 Instruction(例如 - 问候用户,然后询问他们需要怎样的帮助)
- 一切都确定后,按保存

第 6 步:
- 点击切换模拟器图标

- 选择您刚刚创建的代理(例如 Info Agent)
- 为智能体选择底层生成式 AI 模型(例如 gemini-1.5-flash)
- 通过与代理对话来测试代理(即在“Enter User Input”文本框中输入内容)

恭喜!您刚刚使用 Vertex AI Agent Builder 成功创建了一个 AI 智能体。
4. 将数据存储区附加到代理
尝试向智能体询问如何前往瓦坎达(例如“前往瓦坎达的最佳方式是什么?”),您会收到如下回答:

虽然这在事实上是正确的,但如果代理不是简单地说“我无法提供信息”并结束对话,而是建议类似的地方,对用户会更有帮助。这种方法可能会促使用户通过代理实际预订行程。
为了让智能体推荐类似地点,您可以通过数据存储区向智能体提供更多信息。如果智能体无法根据其内置知识回答用户问题,则可将其作为额外的知识库进行参考。
注意:如果您想关闭模拟器,请再次点击切换模拟器图标
创建数据存储区非常简单,只需点击“Agent Basics”页面底部的 + 数据存储区按钮即可。

填写以下信息:
- 工具名称:Alternative Location
- 类型:数据存储区
- 说明:如果用户请求包含不存在的位置,请使用此工具
完成后,请点击保存。
这会创建一个数据存储区工具,供代理与数据存储区通信,但您仍需要创建一个包含信息的实际数据存储区。为此,请点击添加数据存储区和创建数据存储区。


点击创建新的数据存储区后,您将被重定向到 Vertex AI Agent Builder 页面,如下所示
选择“在 Cloud Storage 中”选项

完成此步骤后,
- 点击 FILE(这一点非常重要,否则导入会失败)
- 键入 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 标签页,然后点击刷新。您应该会在可用的数据存储区页面下看到已创建的数据存储区。

为了防止代理出现幻觉,请在数据存储区的接地配置中将设置设为 Very Low,这样可以对代理编造内容施加更严格的限制。目前,请保持默认设置,但您可以随时探索不同的设置。

现在,选择添加的数据存储区,点击确认,然后点击保存。

现在,返回代理基础知识页面,在剧本配置的底部,您会看到新创建的数据存储区(例如“备选位置”)可供使用,选中该数据存储区(例如“备选位置”),然后点击页面顶部的“保存”按钮。


就要大功告成了!最后一步是在智能体的指令中添加“备选位置”工具。添加一行,- 如果用户的请求包含不存在的地理位置,请使用 ${TOOL: Alternative Location},然后点击保存。

一切就绪。我们再次打开切换模拟器,并提出相同的问题(即“前往瓦坎达的最佳方式是什么?”)

恭喜!您的代理现在会使用文本文件中提供的信息来推荐地点。
这样,我们就完成了构建自己的智能体构建器 AI 智能体的任务。如果您想进一步探索如何自定义智能体以获得更好的体验,请查看下面的“其他活动”。
5. 其他活动 - 使 AI 智能体上线
在前面的步骤中,您开发了一个 AI 智能体,并使用相关参考数据为其提供依据。在下一部分中,您将解决一个关键问题:如何将此代理嵌入您的网站中,以便与访问者进行实时互动。
您可以通过多种方式公开代理。您可以导出该视频,也可以直接发布。您可以浏览文档,了解可能的选项。
在 Dialogflow 标签页的右上角,点击溢出菜单,然后点击发布代理

将所有配置保留为默认,然后点击启用未经身份验证的 API。
注意:启用未经身份验证的 API 仅用于演示目的,不建议将此配置用于生产工作负载。如果您有兴趣了解如何安全地发布内容,请参阅此文档。

点击后,您应该会看到一小段 CSS 代码段:

只需复制代码段。您稍后会将此代码段集成到网站中。
您将使用 Cloud Editor 环境来创建网站。以下是打开 Cloud 编辑器的步骤:
- 在另一个标签页中打开 Google Cloud 控制台。
- 点击右上角的“激活 Cloud Shell”按钮
- 点击打开编辑器按钮。
如果系统提示您授权 Cloud Shell,请点击授权继续。

在下一部分中,您将使用 Gemini Code Assist 创建一个示例 Python Flask Web 应用,以与您的代理代码段集成。
打开 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 中的网页预览图标。然后,您可以点击更改端口,输入 5000,然后点击更改并预览以保存。

系统会显示一个示例网站,并且 AI 智能体已可供使用。只需点击 AI 智能体,即可开始与其对话。

您可以随意使用不同的提示来测试此功能。您还可以让 Gemini Code Assist 美化您的网站,或向 AI 智能体添加更多依据数据,使其更具资源性。
准备就绪后,您可以尝试在 Google Cloud 上托管此 AI 代理,以便任何人随时随地都能访问它。在本 Codelab 的剩余部分中,您将以容器的形式在 Cloud Run 中部署此示例 Flask 应用。
注意:这不仅限于 Cloud Run(如果您不知道什么是 Cloud Run,也可以提出此问题),您还可以让 Gemini 代码辅助工具帮助您按照最佳实践在 Google Cloud 或任何其他位置部署此应用,它也可以在这方面为您提供帮助。
返回 Cloud Shell 终端,然后按 Ctrl+C 终止该进程。再次点击打开编辑器,然后让 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 账号收取费用,请按照以下步骤操作: