在 AI 时代构建应用

1. 概览

在本实验中,您将使用 Google 的生成式 AI 产品,借助 Gemini Cloud Assist 在 Google Cloud 中构建基础架构,使用 Data Canvas 的自然语言 SQL 功能查询 BigQuery 数据,借助 Gemini Code Assist 在 Colab Enterprise Jupyter 笔记本和 Eclipse Theia(Visual Studio Code)中编写代码,并在 Vertex AI Agent Builder 中集成基于 Cloud Storage 和 BigQuery 基础来源构建的 AI 搜索和聊天功能。

我们的目标是创建一个名为 AI Recipe Haven 的食谱和烹饪网站。该网站将使用 Python 和 Streamlit 构建,并包含两个主要页面。Cooking Advice 将托管一个聊天机器人,我们将使用 Gemini 和与一组食谱相关联的 Vertex AI Agent Builder 基础来源来创建该聊天机器人,它将提供烹饪建议并回答烹饪相关问题。食谱搜索将成为一个由 Gemini 提供数据的搜索引擎,这次将基于 BigQuery 食谱数据库。

如果您在本练习中的任何代码上遇到问题,请前往练习 GitHub 代码库中的 solution 分支,查看所有代码文件的解决方案。

目标

在本实验中,您将学习如何执行以下任务:

  • 激活和使用 Gemini Cloud Assist
  • 在 Vertex AI Agent Builder 中为烹饪建议聊天机器人创建一个搜索应用
  • 借助 Gemini Code Assist,在 Colab Enterprise 笔记本中加载和清理数据
  • 在 Vertex AI Agent Builder 中为食谱生成器创建搜索应用
  • 在 Gemini 的帮助下,构建核心 Python 和 Streamlit Web 应用
  • 将 Web 应用部署到 Cloud Run
  • 将“烹饪建议”页面连接到我们的食谱搜索 Agent Builder 应用
  • (可选)将食谱搜索页面连接到食谱搜索 Agent Builder 应用
  • (可选)探索最终应用

2. 前提条件

  1. 如果您还没有 Google 账号,则必须先创建一个 Google 账号
    • 请使用个人账号,而不是工作账号或学校账号。工作账号和学校账号可能会受到限制,导致您无法启用本实验所需的 API。

3. 项目设置

  1. 登录 Google Cloud 控制台
  2. 在 Cloud 控制台中启用结算功能
    • 完成本实验所需的 Cloud 资源费用应低于 1 美元。
    • 您可以按照本实验最后的步骤删除资源,以免产生更多费用。
    • 新用户符合参与 300 美元免费试用计划的条件。
    • 要参加线上实操实验活动?您可能会获得 5 美元抵用金
  3. 创建新项目或选择重复使用现有项目。
  4. 在 Cloud Billing 的我负责的项目中确认已启用结算功能
    • 如果新项目的 Billing account 列显示 Billing is disabled
      1. 点击 Actions 列中的三点状图标
      2. 点击更改结算信息
      3. 选择要使用的结算账号
    • 如果您参加的是线下活动,该账号的名称可能为 Google Cloud Platform 试用结算账号

4. 激活和使用 Gemini Cloud Assist

在本任务中,我们将激活并使用 Gemini Cloud Assist。在 Google Cloud 控制台中工作时,Gemini Cloud Assist 可以提供建议,帮助您构建、配置和监控 Google Cloud 基础架构,甚至可以建议 gcloud 命令和编写 Terraform 脚本。

  1. 如需激活 Cloud Assist 以供使用,请点击 Cloud 控制台界面顶部的搜索框,然后选择 Ask GeminiAsk Gemini for Cloud console
  2. 滚动到该页面的“必需的 API”部分,然后启用 Gemini for Google Cloud API。
  3. 如果系统没有立即显示聊天界面,请点击开始聊天。首先,请让 Gemini 说明使用 Cloud Shell Editor 的一些好处。请花几分钟时间探索生成的回答。
  4. 接下来,询问 Agent Builder 的优势以及它如何帮助生成有依据的回答。
  5. 最后,我们来对比一下。在 Google Cloud 控制台中的 Gemini 聊天窗口中,询问以下问题:
    What are the major steps to creating a search app grounded in a GCS data source using Vertex AI Agent builder?
    

5. 在 Vertex AI Agent Builder 中为烹饪建议聊天机器人创建搜索应用

我们要构建的网站将有一个烹饪建议页面,其中包含一个聊天机器人,旨在帮助用户找到烹饪相关问题的答案。该工具将由 Gemini 提供支持,其依托的来源包含 70 本公共领域食谱。这些食谱将成为 Gemini 在回答问题时使用的可靠来源。

  1. 使用 Cloud 控制台搜索框前往 Vertex AI。在信息中心内,点击启用所有推荐的 API。这可能需要几分钟的时间。如果您看到一条关于 Vertex AI API 本身需要启用的弹出式框,请一并启用该 API。启用 API 后,您可以进入下一步。
  2. 使用搜索功能前往 Agent Builder,然后点击继续并激活 API
  3. 正如 Gemini 在之前的咨询中建议的那样,在 Agent Builder 中创建搜索应用的第一步是创建权威数据源。当用户进行搜索时,Gemini 会理解问题并了解如何撰写智能回答,但它会查看依据来源,以获取回答中所用的信息,而不是从自身固有的知识中提取信息。在左侧菜单中,依次选择数据存储区创建数据存储区
  4. 我们在烹饪建议页面中使用的公共领域食谱目前位于外部项目的 Cloud Storage 存储分区中。选择 Cloud Storage 来源类型。
  5. 检查与我们要导入的信息类型相关的默认选项,但不要更改这些选项。将导入类型保留为文件夹,并使用以下存储分区路径:labs.roitraining.com/labs/old-cookbooks,然后点击继续
  6. 为数据存储区命名:old-cookbooks。点击修改,将 ID 更改为 old-cookbooks-id,然后创建数据存储区。

Vertex AI Agent Builder 支持多种应用类型,而数据存储区则充当每种应用的真相来源。搜索应用适合一般使用和搜索。Chat 应用适用于 Dataflow 驱动的聊天机器人/语音聊天机器人应用中的生成式流程。推荐应用有助于打造更出色的推荐引擎。代理应用用于创建由生成式 AI 驱动的代理。最终,智能助理可能最适合我们要做的事,但由于该产品目前处于预览阶段,我们将继续使用搜索应用类型。

  1. 使用左侧菜单前往 Apps(应用),然后点击 Create A New App(创建新应用)。
  2. 点击搜索您的网站卡片上的创建。将应用命名为 cookbook-search。点击修改,然后将应用 ID 设置为 cookbook-search-id。将公司设置为 Google,然后点击继续
  3. 选中您在前几步中创建的 old-cookbooks 数据存储区,然后创建搜索应用。

如果您查看活动标签页,可能会发现食谱集仍在导入和编入索引。Agent Builder 需要 5 分钟以上的时间才能为我们提供的 70 本食谱中包含的数千个网页编制索引。在等待期间,我们来为食谱生成器加载并清理一些食谱数据库数据。

6. 借助 Gemini Code Assist 在 Colab Enterprise 笔记本中加载和清理数据

Google Cloud 提供了几种主要方式来使用 Jupyter 笔记本。我们将使用 Google 的最新产品 Colab Enterprise。有些人可能熟悉 Google 的 Colab 产品,该产品通常供希望在免费环境中试用 Jupyter 笔记本的个人和组织使用。Colab Enterprise 是一款 Google Cloud 商用产品,与 Google 的其他云产品完全集成,可充分利用 GCP 环境的安全和合规性功能。

Colab Enterprise 提供的一项功能是与 Google 的 Gemini Code Assist 集成。代码辅助功能可在许多不同的代码编辑器中使用,可在您编码时提供建议以及流畅的内嵌建议。在处理食谱数据时,我们将利用这款生成式助理。

  1. 使用搜索功能前往 Colab Enterprise,然后点击创建笔记本。如果您收到试用新版 Colab 功能的邀请,请关闭该邀请。如需启动笔记本背后的运行时(计算能力),请点击新笔记本右上角的连接交流
  2. 依次点击文件 > 重命名,将笔记本重命名为 Data Wrangling三点状图标重命名
  3. 点击 + 文本以创建一个新的文本框,然后使用向上箭头将其移动到页面上的第一个单元格。+ 文本和向上箭头
  4. 修改文本框,然后输入以下内容:
    # Data Wrangling
    
    Import the Pandas library
    
  5. 在您刚刚创建的文本块下方的代码块中,开始输入 imp,Gemini Code Assist 应该会以灰色显示导入的其余部分。按 Tab 键可接受建议。
    import pandas as pd
    
  6. 在“导入代码”框下方,创建另一个文本框,然后输入以下内容:
    Create a Pandas DataFrame from: gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv. View the first few records.
    
  7. 创建和修改另一个代码块。再次开始输入 df =,然后检查 Gemini Code Assistant 生成的代码。如果您在生成的建议上方看到 Python 关键字的自动补全下拉列表,请按 Escape 键以查看浅灰色的建议代码。再次按 Tab 键即可接受建议。如果您的建议不包含 head() 函数调用,请添加该调用。
    df = pd.read_csv('gs://labs.roitraining.com/labs/recipes/recipe_dataset.csv')
    df.head()
    
  8. 点击您导入 Pandas 的第一个代码单元格,然后使用 Commands 菜单或键盘运行所选单元格。在键盘上,按 Shift+Enter 键可运行单元格并将焦点移至下一个单元格,并在需要时创建一个单元格。请等待单元格执行完毕,然后再继续操作。注意:如果单元格尚未执行,您会在左侧看到 [ ]。在单元格执行期间,您会看到旋转的动画效果。单元格填充完毕后,系统会显示一个数字,例如 [13]。
  9. 执行将 CSV 文件加载到 DataFrame 中的单元格。等待文件加载,然后检查前五行数据。这是我们将加载到 BigQuery 中的食谱数据,最终会用它来为食谱生成器提供依据。
  10. 创建一个新的代码块,然后输入以下注释。输入注释后,移至下一行代码,您应该会收到建议 df.columns。接受该提示,然后运行该单元格。
    # List the current DataFrame column names
    
    我们刚才演示了,您在 Jupyter 笔记本中获取 Gemini Code Assist 帮助的方式实际上有两种:在代码单元格上方使用文本单元格,或在代码单元格内使用注释。代码单元格中的注释在 Jupyter 笔记本中非常有用,但这种方法也适用于支持 Google 的 Gemini Code Assist 的任何其他 IDE。
  11. 我们来对列进行一些清理操作。将 Unnamed: 0 列重命名为 id,将 link 列重命名为 uri。使用您选择的提示 > 代码技术创建代码,然后在满意后运行单元格。
    # Rename the column 'Unnamed: 0' to 'id' and 'link' to 'uri'
    df.rename(columns={'Unnamed: 0': 'id', 'link': 'uri'}, inplace=True)
    
  12. 移除 sourceNER 列,然后使用 head() 查看前几行。再次让 Gemini 来帮忙。运行最后两行代码并查看结果。
    # Remove the source and NER columns
    df.drop(columns=['source', 'NER'], inplace=True)
    df.head()
    
  13. 我们来看看数据集中有多少条记录。同样,请先使用您选择的提示方法,看看 Gemini 能否帮助您生成代码。
    # Count the records in the DataFrame
    df.shape # count() will also work
    
  14. 223 万条记录可能超出了我们处理的时间。在今天的练习中,Agent Builder 中的索引编制过程可能需要太长时间。作为折中方案,我们抽取 15 万个食谱来进行处理。使用提示 > 代码方法获取样本,并将其存储在名为 dfs(小写字母 s)的新 DataFrame 中。
    # Sample out 150,000 records into a DataFrame named dfs
    dfs = df.sample(n=150000)
    
  15. 我们的食谱来源数据已准备好加载到 BigQuery 中。在加载数据之前,我们先前往 BigQuery 准备一个数据集来存放我们的表。在 Google Cloud 控制台中,使用搜索框前往 BigQuery。您可以右键点击 BigQuery,然后在新浏览器标签页中打开它。
  16. 如果您还没有看到该面板,请使用 Cloud 控制台右上角的 Gemini 徽标打开 Gemini AI Chat 面板。如果系统要求您再次启用该 API,请按“启用”或刷新页面。运行提示:What is a dataset used for in BigQuery?探索回答问题后,How can I create a dataset named recipe_data using the Cloud Console?将结果与以下几个步骤进行比较。打开 Gemini Cloud Assist
  17. 在 BigQuery 的“探索器”窗格中,点击项目 ID 旁边的三点状图标 View actions(查看操作)菜单。然后选择创建数据集探索“查看”操作
  18. 提供 recipe_data 的数据集和 ID。将位置类型保留为 US,然后创建数据集。如果您收到数据集已存在的错误消息,请直接继续操作。在 BigQuery 中创建数据集后,我们再切换回笔记本并执行插入操作。
  19. 切换回 Colab Enterprise 中的数据处理笔记本。在新建的代码单元格中,创建一个名为 project_id 的变量,并将其用来存储当前项目 ID。在这些说明的左上角,点击“End Lab”(结束实验)按钮下方,您会看到当前的项目 ID。您也可以在 Cloud 控制台首页上找到该链接。将该值分配给 project_id 变量,然后运行该单元格。
    # Create a variable to hold the current project_id
    project_id='YOUR_PROJECT_ID'
    
  20. 使用提示 > 代码方法创建一个代码块,用于将 DataFrame dfs 插入到我们刚刚创建的数据集 recipe_data 中名为 recipes 的表中。运行该单元。
    dfs.to_gbq(destination_table='recipe_data.recipes', project_id=project_id, if_exists='replace')
    

7. 在 Vertex AI Agent Builder 中为食谱生成器创建搜索应用

太棒了,我们已经创建了食谱数据表,接下来让我们使用它为食谱生成器构建一个可靠的数据源。我们将采用与烹饪聊天机器人类似的方法。我们将使用 Vertex AI Agent Builder 创建数据存储区,然后将其用作搜索应用的真相来源。

如有需要,您可以随时在 Google Cloud 控制台中询问 Gemini,让其提醒您创建 Agent Builder 搜索应用的步骤,也可以按照下列步骤操作。

  1. 使用搜索功能前往 Agent Builder。打开数据存储区创建数据存储区。这次,选择 BigQuery 数据存储类型。
  2. 在表格选择单元格中,按 Browse(浏览),然后搜索 recipes。选择表格旁边的单选按钮。如果您看到其他 qwiklabs-gcp-... 项目中的食谱,请务必选择您自己的食谱。注意:如果您点击 recipes,而不是选择旁边的单选按钮,系统会在浏览器中打开一个新标签页,并将您转到 BigQuery 中的表概览页面。只需关闭浏览器标签页,然后在 Agent Builder 中选择相应单选按钮即可。
  3. 检查其余默认选项(但不要更改),然后点击继续
  4. 在架构检查页面中,检查初始默认配置,但请勿更改任何内容。继续
  5. 将数据存储区命名为 recipe-data。修改数据存储区 ID,并将其设为 recipe-data-id创建数据存储区。
  6. 使用左侧导航菜单前往应用,然后点击创建新应用
  7. 点击搜索您的网站卡片上的创建。将应用命名为 recipe-search,然后点击修改将 ID 设置为 recipe-search-id。将公司名称设为 Google,然后继续
  8. 这次,请检查 recipe-data 数据源。创建应用。

我们的数据库表需要一段时间才能编制索引。在等待期间,我们来试用一下 BigQuery 的新数据画布,看看能否找到一些有趣的做法。

  1. 使用搜索框前往 BigQuery。在 BigQuery Studio 顶部,点击最右侧标签页旁边的下拉箭头,然后选择数据画布。将区域设置为 us-central1打开数据画布
  2. 点击搜索数据。在数据画布搜索框中,搜索 recipes,按 Enter/Return 进行搜索,然后点击表名称旁边的添加到画布按钮。
  3. 系统会将食谱表的直观表示法加载到 BigQuery 数据画布中。您可以浏览表的架构、预览表中的数据,以及查看其他详细信息。在表格表示形式下方,点击查询
  4. 画布将加载一个大致典型的 BigQuery 查询对话框,但有一个附加项:查询窗口上方有一个文本框,您可以使用该文本框向 Gemini 提示帮助。我们来看看能否在示例中找到一些蛋糕食谱。运行以下提示(通过输入文本并按 Enter/Return 触发 SQL 生成):
    Please select the title and ingredients for all the recipes with a title that contains the word cake.
    
  5. 查看生成的 SQL。对查询结果满意后,运行查询。
  6. 还不错!在继续之前,您可以随意尝试其他一些问题和询问。进行实验时,请尝试使用较宽泛的提示,看看哪些提示有效,哪些无效。例如,以下提示:
    Do I have any chili recipes?
    
    (别忘了运行新查询)返回了一系列辣椒食谱,但省略了食材,直到我将其修改为:
    Do I have any chili recipes?  Please include their title and ingredients.
    
    (是的,我会在提示时说“请”。妈妈会为我感到骄傲的。)我注意到,其中一个辣椒食谱中含有蘑菇,谁会想在辣椒中放蘑菇?我让 Gemini 帮我排除这些食谱。
    Do I have any chili recipes?  Please include their title and ingredients, and ignore any recipes with mushrooms as an ingredient.
    

8. 打开 Cloud Shell Editor

  1. 前往 Cloud Shell Editor
  2. 如果终端未显示在屏幕底部,请打开它:
    • 点击汉堡式菜单 汉堡式三线图标
    • 点击终端
    • 点击 New Terminal在 Cloud Shell Editor 中打开新终端
  3. 在终端中,使用以下命令设置项目:
    • 格式:
      gcloud config set project [PROJECT_ID]
      
    • 示例:
      gcloud config set project lab-project-id-example
      
    • 如果您不记得项目 ID,请执行以下操作:
      • 您可以使用以下命令列出所有项目 ID:
        gcloud projects list | awk '/PROJECT_ID/{print $2}'
        
      在 Cloud Shell Editor 终端中设置项目 ID
  4. 如果系统提示您进行授权,请点击授权继续。点击以授权 Cloud Shell
  5. 您应会看到以下消息:
    Updated property [core/project].
    
    如果您看到 WARNING 并收到 Do you want to continue (Y/N)? 询问,则可能输入的项目 ID 有误。按 N,按 Enter,然后尝试再次运行 gcloud config set project 命令。

9. 启用 API

在终端中,启用以下 API:

gcloud services enable \
  compute.googleapis.com \
  sqladmin.googleapis.com \
  run.googleapis.com \
  artifactregistry.googleapis.com \
  cloudbuild.googleapis.com \
  networkconnectivity.googleapis.com \
  servicenetworking.googleapis.com \
  cloudaicompanion.googleapis.com

如果系统提示您进行授权,请点击授权继续。点击以授权 Cloud Shell

此命令可能需要几分钟才能完成,但最终应该会显示如下所示的成功消息:

Operation "operations/acf.p2-73d90d00-47ee-447a-b600" finished successfully.

10. 在 Gemini 的帮助下,构建核心 Python 和 Streamlit Web 应用

现在,我们的两个 Vertex AI Agent Builder 数据存储区都已编制索引,我们的搜索应用也即将发布,接下来我们来构建 Web 应用。

我们将在工作中利用 Gemini Code Assist。如需详细了解如何在 Visual Studio Code 中使用 Gemini Code Assist,请参阅此处的文档

  1. 在 Cloud Shell 编辑器终端中,运行以下命令来克隆食谱应用代码库。
    git clone https://github.com/haggman/recipe-app
    
  2. 运行此命令可在 Cloud Shell Editor 中打开应用文件夹。
    cloudshell open-workspace recipe-app/
    
  3. 在浏览克隆的文件夹并开始处理 Web 应用之前,我们需要让编辑器的 Cloud Code 插件登录 Google Cloud,并启用 Gemini。现在就开始吧。在编辑器的左下角,点击 Cloud Code - Sign in(Cloud Code - 登录)。如果您没有看到链接,请稍等片刻,然后再检查一次。Cloud Code - 登录
  4. 终端窗口会显示一个长网址。在浏览器中打开该网址,然后按照相应步骤向 Cloud Code 授予对您 Google Cloud 环境的访问权限。在最终对话框中,复制验证码,然后将其粘贴回 Cloud Shell Editor 浏览器标签页中的等待终端窗口。
  5. 几秒钟后,编辑器左下角的 Cloud Code 链接将更改为 Cloud Code - No Project(Cloud Code - 无项目)。点击新的链接以选择项目。命令面板应会在编辑器顶部打开。点击选择 Google Cloud 项目,然后选择您的项目。几秒钟后,编辑器左下角的链接将更新为显示您的项目 ID。这表示 Cloud Code 已成功附加到您的工作项目。
  6. 将 Cloud Code 关联到您的项目后,您现在可以激活 Gemini Code Assist。点击编辑器界面右下角带有删除线的 Gemini 徽标。Gemini Chat 窗格会在编辑器左侧打开。点击选择 Google Cloud 项目。命令 Palette 打开后,选择您的项目。如果您已正确按照步骤操作(并且 Google 未更改任何内容),则现在应该会看到一个处于活动状态的 Gemini Chat 窗口。停用了 Gemini
  7. 太棒了,终端、Gemini 聊天和 Cloud Code 配置都已设置完毕,现在打开 Explorer 标签页,花几分钟时间探索当前项目中的文件。探索器
  8. 在资源管理器中,打开 requirements.txt 文件进行修改。切换到 Gemini 聊天窗格,然后询问:
    From the dependencies specified in the requirements.txt file, what type of application are we building?
    
  9. 因此,我们将使用 Python 和 Streamlit 构建一个交互式 Web 应用,该应用可与 Vertex AI 和 Discovery Engine 进行交互,太棒了。目前,我们主要关注 Web 应用组件。正如 Gemini 所说,Streamlit 是一个用于使用 Python 构建数据驱动型 Web 应用的框架。现在,请问:
    Does the current project's folder structure seem appropriate for a Streamlit app?
    
    Gemini 通常会在此处出现问题。Gemini 可以访问您当前在编辑器中打开的文件,但实际上无法看到整个项目。试着这样问:
    Given the below, does the current project's file and folder structure seem appropriate for a Streamlit app?
    - build.sh
    - Home.py
    - requirements.txt
    - pages
    -- Cooking_Advice.py
    -- Recipe_Search.py
    
    想要更好的答案?
  10. 我们来详细了解一下 Streamlit:
    What can you tell me about Streamlit?
    
    太棒了,我们可以看到 Gemini 提供了一个很好的概览,包括优点和缺点。
  11. 如果您想了解缺点,可以问:
    What are the major downsides or shortcomings?
    
    请注意,我们无需说“of Streamlit”,因为 Gemini Chat 是会话式(多轮对话)的。由于我们正在进行聊天会话,Gemini 知道我们一直在讨论什么。如需随时清除 Gemini 聊天记录,请使用 Gemini 代码聊天窗口顶部的回收站图标。

11. 将 Web 应用部署到 Cloud Run

太棒了,我们已经完成了核心应用结构的设置,但所有这些都能够正常运行吗?更好的是,我们应该在 Google Cloud 中的哪个位置托管它?

  1. 在 Gemini 聊天窗口中,询问以下问题:
    If I containerize this application, what compute technologies in Google Cloud would be best for hosting it?
    
  2. 请注意,如果您尚未在 IDE 中工作,也可以使用 Google Cloud Assist。打开 Google Cloud 控制台,然后打开 Gemini Cloud Assist 并询问:
    If I have a containerized web application, where would be the best place to run it in Google Cloud?
    
    这两组建议是否相同?您是否赞同/不赞同其中的任何建议?请注意,Gemini 是一款生成式 AI 助理,就像真人助理一样,您并不一定会同意它所说的一切。不过,在 Google Cloud 和代码编辑器中工作时,如果有这样一个助手随时随地为您提供帮助,您的工作效率会大大提高。
  3. 对于无状态的短时容器化 Web 应用,Cloud Run 是一个绝佳之选。在代码编辑器的 Gemini Chat 窗口中,尝试以下提示:
    What steps would be required to run this application in Cloud Run?
    
  4. 我们首先需要创建一个 Dockerfile。使用编辑器在项目文件夹的根目录中创建一个名为 Dockerfile 的文件。请确保您没有意外将其放入 pages 文件夹中。打开文件进行修改。
  5. 我们使用 Gemini 侧边聊天面板创建 Dockerfile。使用如下所示的提示。当聊天中显示结果时,使用建议的 Dockerfile 上方复制图标旁边的 + 将建议的代码插入 Dockerfile。
    Create a Dockerfile for the application in the current folder. The dependencies are defined in requirements.txt and I want you to use the Python 3 slim bookworm base image.
    
    Gemini 对同一问题的回答并不总是相同。我第一次向 Gemini 请求 Dockerfile 时,就得到了我建议您使用的确切文件。我刚刚收到了以下建议:
    # Base image
    FROM python:3-bookworm-slim
    
    # Set working directory
    WORKDIR /app
    
    # Install dependencies
    RUN apt-get update && apt-get install -y \
        build-essential \
        libpq-dev \
        gcc \
        python3-dev \
        && rm -rf /var/lib/apt/lists/*
    
    # Install pip and virtualenv
    RUN pip install --upgrade pip virtualenv
    
    # Create virtual environment
    RUN python3 -m venv venv
    
    # Activate virtual environment
    WORKDIR /app/venv/bin
    RUN . activate
    
    # Install Streamlit and libraries from requirements.txt
    RUN pip install -r requirements.txt
    
    # Copy application files
    COPY . /app
    
    # Expose port 8501 for Streamlit
    EXPOSE 8501
    
    # Start Streamlit app
    CMD ["streamlit", "run", "main.py"]
    
    这是一个非常棒的 Dockerfile。我来简化一下。我们不需要 apt-get 部分,因为 Python 所需的所有内容都已在我们的基础映像中。此外,在 Python 容器中使用虚拟环境会浪费空间,因此我会将其移除。曝光命令并非完全必要,但可以使用。此外,它还尝试启动 main.py,但我没有该文件。
  6. recipe-app 文件夹中,创建一个名为 Dockerfile 的文件,并粘贴以下内容:
    FROM python:3.11-slim-bookworm
    
    WORKDIR /app
    
    COPY requirements.txt .
    RUN pip install --no-cache-dir --upgrade pip && \
        pip install --no-cache-dir -r requirements.txt
    
    COPY . .
    
    CMD ["streamlit", "run", "Home.py"]
    
  7. Gemini 可以通过聊天窗口操作,但也可以直接在代码文件中使用注释操作,就像我们在数据处理笔记本中所做的那样。您还可以在 Windows 上使用 Ctrl+i 或在 Mac 上使用 Command+i 调用 Gemini。点击 Dockerfile 中的任意位置,然后使用相应的 Command+i / Ctrl+i 命令激活 Gemini。
  8. 在提示符处,输入以下内容。检查并接受更改。
    Please comment the current file.
    
    这不是很酷吗?您有多少次不得不处理他人的代码,但在开始进行更改之前,却不得不浪费时间来了解其未加注释的工作的基本信息。Gemini 来助你脱困!
  9. 现在,请问 Gemini 如何使用 Cloud Run 从当前文件夹中的 Dockerfile 构建并部署名为 recipe-web-app 的新映像。
    How could I use gcloud to build a new Cloud Run service named recipe-web-app from the current directory?
    
  10. 接下来,我们来构建并部署应用。在终端窗口中,执行 gcloud run deploy 命令
    gcloud run deploy recipe-web-app \
        --allow-unauthenticated \
        --source=. \
        --region=us-central1 \
        --port=8501
    
    如果系统提示您创建 Artifact Registry 仓库,请按 enter/return
    Deploying from source requires an Artifact Registry Docker repository to store built containers. A repository
    named cloud-run-source-deploy in region us-central1 will be created.
    
    Do you want to continue (Y/n)?
    
  11. 如果您观察构建过程,会发现它首先会构建 Artifact Registry Docker 代码库。然后,它使用 Cloud Build 根据本地文件夹中的 Dockerfile 创建容器映像。最后,Docker 映像将部署到新的 Cloud Run 服务中。脚本结束时,您会看到一个可用的 Cloud Run 测试网址。

在浏览器的新标签页中打开返回的链接。请花点时间浏览一下应用的结构和页面。太棒了,现在我们需要挂接生成式 AI 功能。

12. 将“烹饪建议”页面连接到我们的食谱搜索 Agent Builder 应用

我们已经有了运行 Web 应用的框架,但需要将两个工作页面连接到两个 Vertex AI Agent Builder 搜索应用。我们先从烹饪建议开始。

  1. 让 Cloud Shell Editor 标签页保持打开状态。在 Google Cloud 控制台中,使用搜索功能前往 Vertex AI 中的聊天
  2. 在右侧的“设置”页面窗格中,将模型设置为 gemini-1.5-flash-002。将输出令牌数上限滑动到最大值,以便模型在需要时返回较长的回答。打开安全过滤条件设置。将“仇恨言论”“露骨色情内容”和“骚扰内容”设置为屏蔽部分。将“危险内容”设置为屏蔽少部分,然后点击保存。我们将“危险内容”的评分稍微降低了,因为谈论刀具和切割可能会被 Gemini 误解为暴力行为。
  3. 滑动切换开关以启用接地,然后点击自定义。将依据来源设置为 Vertex AI Search,并使用以下数据存储区路径。将 YOUR_PROJECT_ID 更改为这些说明中“结束实验”按钮附近显示的项目 ID,然后保存接地设置
    projects/YOUR_PROJECT_ID/locations/global/collections/default_collection/dataStores/old-cookbooks-id
    
    注意:如果您收到错误消息,则表示您未将项目 ID 更改为实际项目 ID,或者您可能错过了更改旧版 Cookbooks Agent Builder 数据存储区 ID 的步骤。请依次前往“代理构建器”>“数据存储区”>“old-cookbooks”,查看其实际的数据存储区 ID。
  4. 测试几条聊天消息。不妨从以下内容入手。如有需要,请尝试其他一些酒店。
    How can I tell if a tomato is ripe?
    
  5. 模型已正常运行,现在我们来对代码进行实验。点击清除对话,以免我们的对话成为生成的代码的一部分,然后点击获取验证码清除对话并获取代码
  6. 在代码窗口顶部,按 Open Notebook(打开笔记本),以便我们先在 Colab Enterprise 中对代码进行实验和完善,然后再将其集成到应用中。
  7. 请花几分钟时间熟悉一下代码。我们来进行一些更改,使其符合我们的要求。在开始之前,请运行第一个代码单元以连接到计算环境并安装 AI Platform SDK。代码块运行完毕后,系统会提示您重启会话。按照提示操作即可。
  8. 切换到我们从 Vertex AI Studio 中提取的代码。将方法 multiturn_generate_content 的名称更改为 start_chat_session
  9. 滚动到 model = GenerativeModel( 方法调用。现有代码定义了 generation_configsafety_settings,但实际上并未使用它们。修改 GenerativeModel 的创建,使其类似于:
    model = GenerativeModel(
        "gemini-1.5-flash-002",
        tools=tools,
        generation_config=generation_config,
        safety_settings=safety_settings,
    )
    
  10. 最后,在 chat = model.start_chat() 的正下方,向该方法添加最后一行代码,以便该函数返回 chat 对象。完成后的函数应如下所示。注意:请勿将此代码复制到您的记事中。它只是用作一个健全性检查。
    def start_chat_session():
        vertexai.init(project="qwiklabs-gcp-02-9a7298ceaaec", location="us-central1")
        tools = [
            Tool.from_retrieval(
                retrieval=grounding.Retrieval(
                    source=grounding.VertexAISearch(datastore="projects/qwiklabs-gcp-02-9a7298ceaaec/locations/global/collections/default_collection/dataStores/old-cookbooks-id"),
                )
            ),
        ]
        model = GenerativeModel(
            "gemini-1.5-flash-002",
            tools=tools,
            generation_config=generation_config,
            safety_settings=safety_settings,
        )
        chat = model.start_chat()
        return chat
    
  11. 滚动到代码单元格的底部,然后更改调用旧函数的最后一行,使其调用新函数名称并将返回的对象存储在变量 chat 中。对所做的更改感到满意后,运行单元格。
    chat = start_chat_session()
    
  12. 创建一个新的代码单元,并添加注释 # Use chat to invoke Gemini and print out the response。移至下一行并输入 resp,Gemini 应该会自动为您填充代码块。将提示更新为 How can I tell if a tomato is ripe?。运行单元
    response = chat.send_message("How can I tell if a tomato is ripe?")
    print(response)
    
  13. 这确实是响应,但我们真正需要的是嵌套的 text 字段。修改代码块,以便仅输出该部分,例如:
    response = chat.send_message("How can I tell if a tomato is ripe?")
    print(response.candidates[0].content.parts[0].text)
    
  14. 太棒了,现在我们已经有了可用的聊天代码,接下来将其集成到 Web 应用中。复制用于创建 start_chat_session 函数的代码单元的所有内容(我们不需要测试单元)。点击相应单元格后,您可以点击右上角的三点状菜单,然后从中复制复制单元格
  15. 切换到 Cloud Shell Editor 标签页,然后打开 pages\Cooking_Advice.py 进行修改。
  16. 找到相应评论:
    #
    # Add the code you copied from your notebook below this message
    #
    
  17. 将复制的代码粘贴到 Add the code 注释下方。太棒了,现在我们有了通过对 Gemini 的基于地面的调用来驱动聊天引擎的部分。现在,我们将其集成到 Streamlit 中。
  18. 找到注释下方的注释代码部分:
    #
    # Here's the code to setup your session variables
    # Uncomment this block when instructed
    #
    
  19. 取消注释这段代码(直到下一个 Setup done, let's build the page UI 部分),并对其进行探索。它会创建或检索聊天和历史记录会话变量。
  20. 接下来,我们需要将历史记录和聊天功能集成到界面中。在代码中滚动,直到找到以下注释。
    #
    # Here's the code to create the chat interface
    # Uncomment the below code when instructed
    #
    
  21. 取消注释注释下方的其余代码,并花点时间探索一下。您可以突出显示该代码,让 Gemini 介绍其功能。
  22. 太棒了,现在我们来构建并部署应用。网址恢复后,请启动应用并试用“烹饪顾问”页面。你可以问它成熟的西红柿,或者它知道如何烹饪布鲁塞尔芽菜。
    gcloud run deploy recipe-web-app \
        --allow-unauthenticated \
        --source=. \
        --region=us-central1 \
        --port=8501
    

这样是不是很厉害?您的专属 AI 烹饪顾问 :-)

13. (可选)将食谱搜索页面连接到食谱搜索 Agent Builder 应用

在将“烹饪建议”页面与其可靠来源相关联时,我们直接使用了 Gemini API。对于食谱搜索,我们直接连接到 Vertex AI Agent Builder 搜索应用。

  1. 在 Cloud Shell Editor 中,打开要修改的 pages/Recipe_Search.py 页面。调查网页的结构。
  2. 在文件顶部,设置您的项目 ID。
  3. 检查 search_sample 函数。此代码或多或少直接来自此处的发现引擎文档。您可以在此处的这个笔记中找到可用的副本。我所做的唯一更改是返回 response.results,而不是仅返回结果。如果没有此参数,返回值类型将是一个用于分页浏览结果的对象,而我们的基本应用不需要此对象。
  4. 滚动到文件的开头,然后取消注释 Here are the first 5 recipes I found 下方的整个部分。
  5. 突出显示您刚刚取消注释的整个部分,然后打开 Gemini Code Chat。Explain the highlighted code,请问。如果您未选择任何内容,Gemini 可以解读整个文件。如果您突出显示某个部分,并要求 Gemini 对其进行解释、评论或改进,Gemini 就会执行相应操作。请花些时间仔细阅读相关说明。在将 Gemini API 集成到应用之前,使用 Colab Enterprise 笔记本探索这些 API 是一个不错的方式。这对于探索一些可能未得到充分文档的新 API 尤其有用。
  6. 在编辑器终端窗口中,运行 build.sh 以部署最终应用。等待新版本部署完毕,然后再继续执行下一步。

14. (可选)探索最终应用

花几分钟时间探索一下最终应用。

  1. 在 Google Cloud 控制台中,使用搜索功能前往 Cloud Run,然后点击 recipe-web-app
  2. 找到应用测试网址(位于顶部),然后在新浏览器标签页中打开该网址。
  3. 系统应显示应用首页。请注意 Streamlit 提供的基本布局和导航,其中 pages 文件夹中的 Python 文件显示为导航选项,Home.py 加载为首页。前往烹饪建议页面。
  4. 片刻之后,聊天界面将会显示。再次请注意,Streamlit 提供了精美的核心布局。
  5. 试着问几个与烹饪相关的问题,看看聊天机器人如何运作。如下所示:
    Do you have any advice for preparing broccoli?
    
    How about a classic chicken soup recipe?
    
    Tell me about meringue.
    
  6. 现在,我们来查找一两个食谱。前往“食谱搜索”页面,尝试进行几次搜索。如下所示:
    Chili con carne
    
    Chili, corn, rice
    
    Lemon Meringue Pie
    
    A dessert containing strawberries
    

15. 恭喜!

您已利用 Vertex AI Agent Builder 应用创建了一个应用。在学习过程中,您探索了 Gemini Cloud Assist、Gemini Code Assist 以及 BigQuery 数据画布中的自然语言转换为 SQL 功能。真了不起!

清理

Cloud SQL 没有免费层级,如果您继续使用,我们会向您收费。您可以删除 Cloud 项目,以免产生额外费用。

虽然 Cloud Run 不会对未在使用中的服务计费,但您可能仍然需要为将容器映像存储在 Artifact Registry 中而产生的相关费用付费。删除 Cloud 项目后,系统即会停止对该项目中使用的所有资源计费。

如需删除项目,请执行以下操作:

gcloud projects delete $GOOGLE_CLOUD_PROJECT

您可能还希望从 Cloud Shell 磁盘中删除不必要的资源。您可以:

  1. 删除 Codelab 项目目录:
    rm -rf ~/task-app
    
  2. 警告!下一步操作无法撤消!如果您想删除 Cloud Shell 中的所有内容以释放空间,可以删除整个主目录。请务必将您要保留的所有内容保存到其他位置。
    sudo rm -rf $HOME