Authenticate API Requests

检查我的进度

/ 25

Create an App Engine instance and Storage Bucket

检查我的进度

/ 25

Run the Application

检查我的进度

/ 25

Deploy the App

检查我的进度

/ 25

此实验可能会提供 AI 工具来支持您学习。

GSP023

Google Cloud 自学实验

概览

在本实验中,您将学习如何将 Python Flask Web 应用部署到 App Engine 柔性环境中。示例应用允许用户上传人脸照片,并识别照片中的人处于开心状态的可能性。该应用使用了 Google Cloud Vision、Storage 和 Datastore API。

关于 App Engine

Google App Engine 应用易于创建、易于维护,并且可根据流量和数据存储需求的变化轻松扩缩。使用 App Engine 时,无需维护任何服务器。您只需上传应用,就可以使用了。

App Engine 应用会根据传入的流量自动扩缩。负载均衡、微服务、授权、SQL 和 NoSQL 数据库、流量分配、日志记录、搜索、版本控制、发布和回滚以及安全扫描都是原生支持的,并且高度可自定义。

App Engine 的柔性环境支持众多编程语言,包括 Java、Python、PHP、NodeJS、Ruby 和 Go。App Engine 的标准环境是某些语言(包括 Python)的另一种选择。这两种环境各具优势,为用户提供了极大的灵活性,方便其根据需求决定应用的运行方式。如需了解详情,请参阅选择 App Engine 环境

学习内容

  • 如何将简单的 Web 应用部署到 App Engine 柔性环境
  • 如何访问适用于 Vision、Storage 和 Datastore 的 Google Cloud 客户端库
  • 如何使用 Cloud Shell

前提条件

  • 熟悉 Python
  • 熟悉标准的 Linux 文本编辑器,例如 vim、emacs 或 nano
  • 准备一张包含人脸的图片

设置和要求

点击“开始实验”按钮前的注意事项

请阅读以下说明。实验是计时的,并且您无法暂停实验。计时器在您点击开始实验后即开始计时,显示 Google Cloud 资源可供您使用多长时间。

此实操实验可让您在真实的云环境中开展实验活动,免受模拟或演示环境的局限。为此,我们会向您提供新的临时凭据,您可以在该实验的规定时间内通过此凭据登录和访问 Google Cloud。

为完成此实验,您需要:

  • 能够使用标准的互联网浏览器(建议使用 Chrome 浏览器)。
注意:请使用无痕模式(推荐)或无痕浏览器窗口运行此实验。这可以避免您的个人账号与学生账号之间发生冲突,这种冲突可能导致您的个人账号产生额外费用。
  • 完成实验的时间 - 请注意,实验开始后无法暂停。
注意:请仅使用学生账号完成本实验。如果您使用其他 Google Cloud 账号,则可能会向该账号收取费用。

如何开始实验并登录 Google Cloud 控制台

  1. 点击开始实验按钮。如果该实验需要付费,系统会打开一个对话框供您选择支付方式。右侧是实验设置和访问权限面板,其中包含以下内容:

    • 打开 Google Cloud 控制台按钮
    • 您在本实验中必须使用的临时凭证(用户名和密码)
    • 帮助您逐步完成该实验所需的其他信息(如果需要)

    请注意,实验计时器位于页面顶部附近,将显示剩余时间。

  2. 点击打开 Google Cloud 控制台(如果您使用的是 Chrome 浏览器,请右键点击并选择在无痕式窗口中打开链接)。

    该实验会启动资源并打开另一个标签页,显示“登录”页面。

    提示:可以将这些标签页分别放在不同的窗口中,并排显示。

    注意:如果您看见选择账号对话框,请点击使用其他账号
  3. 如有必要,请复制下方的用户名,然后将其粘贴到登录对话框中。

    {{{user_0.username | "<用户名>"}}}

    您也可以在实验设置和访问权限面板中找到“用户名”。

  4. 点击下一步

  5. 复制下面的密码,然后将其粘贴到欢迎对话框中。

    {{{user_0.password | "<密码>"}}}

    您也可以在实验设置和访问权限面板中找到“密码”。

  6. 点击下一步

    重要提示:您必须使用实验提供的凭证。请勿使用您的 Google Cloud 账号凭证。 注意:在本实验中使用您自己的 Google Cloud 账号可能会产生额外费用。
  7. 依次点击进入后续页面:

    • 接受条款及条件。
    • 由于这是临时账号,请勿添加账号恢复选项或双重身份验证。
    • 请勿注册免费试用。

片刻之后,系统会在此标签页中打开 Google Cloud 控制台。

注意:如需访问 Google Cloud 产品和服务,请点击导航菜单,或在搜索字段中输入服务或产品的名称。 “导航菜单”图标和“搜索”字段

激活 Cloud Shell

Cloud Shell 是一种装有开发者工具的虚拟机。它提供了一个永久性的 5GB 主目录,并且在 Google Cloud 上运行。Cloud Shell 提供可用于访问您的 Google Cloud 资源的命令行工具。

  1. 点击 Google Cloud 控制台顶部的激活 Cloud Shell “激活 Cloud Shell”图标

  2. 在弹出的窗口中执行以下操作:

    • 继续完成 Cloud Shell 信息窗口中的设置。
    • 授权 Cloud Shell 使用您的凭据进行 Google Cloud API 调用。

如果您连接成功,即表示您已通过身份验证,且项目 ID 会被设为您的 Project_ID 。输出内容中有一行说明了此会话的 Project_ID

Your Cloud Platform project in this session is set to {{{project_0.project_id | "PROJECT_ID"}}}

gcloud 是 Google Cloud 的命令行工具。它已预先安装在 Cloud Shell 上,且支持 Tab 自动补全功能。

  1. (可选)您可以通过此命令列出活跃账号名称:
gcloud auth list
  1. 点击授权

输出:

ACTIVE: * ACCOUNT: {{{user_0.username | "ACCOUNT"}}} To set the active account, run: $ gcloud config set account `ACCOUNT`
  1. (可选)您可以通过此命令列出项目 ID:
gcloud config list project

输出:

[core] project = {{{project_0.project_id | "PROJECT_ID"}}} 注意:如需查看在 Google Cloud 中使用 gcloud 的完整文档,请参阅 gcloud CLI 概览指南

任务 1. 获取示例代码

  1. 在 Cloud Shell 中,运行以下命令以复制示例代码:
gcloud storage cp -r gs://spls/gsp023/flex_and_vision/ .
  1. 切换到 flex_and_vision 目录:
cd flex_and_vision

任务 2. 对 API 请求进行身份验证

本实验已自动为您启用 Datastore、Storage 和 Vision API。为了向这些 API 发出请求,您需要服务账号凭证。您可以在 Cloud Shell 中使用 gcloud 为您的项目生成凭证。项目 ID 可以在您开始实验的标签页中找到。

  1. 为您的项目 ID 设置环境变量:
export PROJECT_ID=$(gcloud config get-value project)
  1. 创建服务账号,以便在本地测试时访问 Google Cloud API:
gcloud iam service-accounts create qwiklab \ --display-name "My Qwiklab Service Account"
  1. 为新创建的服务账号授予适当的权限:
gcloud projects add-iam-policy-binding ${PROJECT_ID} \ --member serviceAccount:qwiklab@${PROJECT_ID}.iam.gserviceaccount.com \ --role roles/owner
  1. 创建服务账号后,创建服务账号密钥:
gcloud iam service-accounts keys create ~/key.json \ --iam-account qwiklab@${PROJECT_ID}.iam.gserviceaccount.com

此命令会生成一个服务账号密钥,并将其存储在主目录中名为 key.json 的 JSON 文件中。

  1. 使用生成的密钥的绝对路径,为您的服务账号密钥设置一个环境变量:
export GOOGLE_APPLICATION_CREDENTIALS="/home/${USER}/key.json"

如需详细了解如何对 Vision API 进行身份验证,请参阅快速入门:设置 Vision API 指南。

点击下方的检查我的进度,以检查您的实验进度。

对 API 请求进行身份验证

任务 3. 在本地测试应用

安装依赖项

  1. 使用 pip 根据 requirements.txt 文件安装项目的依赖项:
pip install -r requirements.txt

requirements.txt 文件列出了项目所需的软件包依赖项。上述命令将列出的所有这些软件包依赖项下载到了 virtualenv 中。

创建 App Engine 应用

  1. 首先,使用分配给您的区域创建一个环境变量:
AE_REGION={{{project_0.startup_script.app_region|REGION}}}
  1. 接下来,使用以下命令创建一个 App Engine 实例:
gcloud app create --region=$AE_REGION

创建存储桶

  1. 首先,将环境变量 CLOUD_STORAGE_BUCKET 设置为您的 PROJECT_ID。(为方便起见,通常建议将存储桶命名为与 PROJECT_ID 相同的名称):
export CLOUD_STORAGE_BUCKET=${PROJECT_ID}
  1. 现在,运行以下命令,创建一个与 PROJECT_ID 同名的存储桶:
gcloud storage buckets create gs://${PROJECT_ID}

点击下方的检查我的进度,以检查您的实验进度。

创建 App Engine 应用和存储桶

运行应用

  1. 执行以下命令以启动您的应用:
python main.py
  1. 应用启动后,点击 Cloud Shell 工具栏中的“网页预览”图标 “网页预览”图标,然后选择在端口 8080 上预览

浏览器中会打开一个标签页,并连接到您刚启动的服务器。您应会看到类似下图的界面:

应用页面

接下来,有趣的事情要发生了!

  1. 点击选择文件按钮,从您的计算机中选择一张包含人脸的图片,然后点击提交

上传照片后,您应会看到类似下图的界面:

人脸检测示例页面

注意:在本地测试完应用后,请在 Cloud Shell 中按 Ctrl+C 关闭本地 Web 服务器。

点击下方的检查我的进度,以检查您的实验进度。

运行应用

任务 4. 探索代码

示例代码布局

示例代码的布局如下:

templates/ homepage.html /* HTML template that uses Jinja2 */ app.yaml /* App Engine application configuration file */ main.py /* Python Flask web application */ requirements.txt /* List of dependencies for the project */

main.py

此 Python 文件是一个 Flask Web 应用。该应用允许用户提交照片(最好是人脸照片),这些照片会存储在 Cloud Storage 中,并由 Cloud Vision API 的人脸检测功能进行分析。每张照片的关键信息都存储在 Google Cloud 的 NoSQL 数据库 Datastore 中,用户每次访问网站时都会读取这些信息。

此应用使用适用于 Storage、Datastore 和 Vision 的 Google Cloud 客户端库。借助这些客户端库,您可以使用自己喜欢的编程语言轻松访问 Cloud API。

我们来看看代码的一些关键片段。

顶部的 import 部分用于导入代码所需的各种软件包。以下是导入适用于 Datastore、Storage 和 Vision 的 Google Cloud 客户端库的代码:

from google.cloud import datastore from google.cloud import storage from google.cloud import vision

定义用户访问网站根网址时系统所执行操作的代码

以下代码定义了用户访问网站根网址时系统会执行哪些操作。系统会创建一个 Datastore 客户端对象,用于访问 Datastore 客户端库;然后再对 Datastore 运行查询,以查找种类为 Faces 的实体。最后,系统会渲染 HTML 模板,并将从 Datastore 中提取的 image_entities 作为变量传入。

@app.route('/') def homepage(): # Create a Cloud Datastore client. datastore_client = datastore.Client() # Use the Cloud Datastore client to fetch information from Datastore about # each photo. query = datastore_client.query(kind='Faces') image_entities = list(query.fetch()) # Return a Jinja2 HTML template and pass in image_entities as a parameter. return render_template('homepage.html', image_entities=image_entities)

我们来看看实体是如何保存到 Datastore 的。Datastore 是 Google Cloud 的 NoSQL 数据库解决方案。数据存储在被称为“实体”的对象中。每个实体都会分配到一个唯一的标识键,该键可使用种类和键名字符串来创建。种类是用于划分实体类型的组织容器。例如,我们可能需要为照片、人物和动物设置不同的种类

每个实体可以有多个由开发者定义的属性,这些属性可以包含多种类型的值,包括整数、浮点数、字符串、日期或二进制数据:

# Create a Cloud Datastore client. datastore_client = datastore.Client() # Fetch the current date / time. current_datetime = datetime.now() # The kind for the new entity. kind = 'Faces' # The name/ID for the new entity. name = blob.name # Create the Cloud Datastore key for the new entity. key = datastore_client.key(kind, name) # Construct the new entity using the key. Set dictionary values for entity # keys blob_name, storage_public_url, timestamp, and joy. entity = datastore.Entity(key) entity['blob_name'] = blob.name entity['image_public_url'] = blob.public_url entity['timestamp'] = current_datetime entity['joy'] = face_joy # Save the new entity to Datastore. datastore_client.put(entity)

Storage 和 Vision 客户端库的程序化访问方式与 Datastore 类似。您可以自行使用 vimemacs 或 nano 打开 main.py 文件,以探索所有示例代码。

homepage.html

Flask Web 框架使用 Jinja2 作为模板引擎。这让我们可以将 main.py 中的变量和表达式传递到 homepage.html 中,并在页面渲染时将其替换为具体的值。

如需详细了解 Jinja2,请参阅模板设计器文档

此 Jinja2 HTML 模板会展示一个表单,供用户将照片提交到数据库。它还会展示之前提交的每张图片,并列出其文件名、上传日期/时间,以及 Vision API 检测到的人脸处于开心状态的可能性。

<h1>Google Cloud Platform - Face Detection Sample</h1> <p>This Python Flask application demonstrates App Engine Flexible, Google Cloud Storage, Datastore, and the Cloud Vision API.</p> <br> <html> <body> <form action="upload_photo" method="POST" enctype="multipart/form-data"> Upload File: <input type="file" name="file"><br> <input type="submit" name="submit" value="Submit"> </form> {% for image_entity in image_entities %} <img src="{{image_entity['image_public_url']}}" width=200 height=200> <p>{{image_entity['blob_name']}} was uploaded {{image_entity['timestamp']}}.</p> <p>Joy Likelihood for Face: {{image_entity['joy']}}</p> {% endfor %} </body> </html>

任务 5. 将应用部署到 App Engine 柔性环境

App Engine 柔性环境使用名为 app.yaml 的文件来描述应用的部署配置。如果该文件不存在,App Engine 会尝试猜测部署配置。但是,建议您最好提供该文件。

  1. 接下来,您将使用自己选择的编辑器 vim、nano 或 emacs 来修改 app.yaml。我们将使用 nano 编辑器:
nano app.yaml
  1. 打开 app.yaml 后,将 <your-cloud-storage-bucket> 替换为您的 Cloud Storage 存储桶名称。(如果您忘记了 Cloud Storage 存储桶的名称,请从“实验详细信息”面板中复制项目 ID)。

env_variables 部分用于设置环境变量,这些变量将在应用部署后供 main.py 使用。

  1. 接下来,在文件末尾添加以下内容,将应用设置为使用手动扩缩
manual_scaling: instances: 1
  1. 最后,务必将 python_version 设置为 3.12,以便成功部署 App Engine 应用。

您的文件应如下所示:

runtime: python env: flex entrypoint: gunicorn -b :$PORT main:app runtime_config: operating_system: "ubuntu22" runtime_version: "3.12" env_variables: CLOUD_STORAGE_BUCKET: <your-cloud-storage-bucket> manual_scaling: instances: 1

以上是部署 Python 3 App Engine 柔性环境应用所需的基本配置。如需详细了解如何配置 App Engine,请参阅使用 app.yaml 配置应用指南。

  1. nano 中保存并关闭文件:
  • 按 CTRL+X。
  • 在提示符处输入 Y,然后按 Enter 键。
  1. 更新 Cloud Build 超时时间:
gcloud config set app/cloud_build_timeout 1000
  1. 使用 gcloud 将应用部署到 App Engine:
gcloud app deploy

如果系统提示 Do you want to continue (Y/n),请输入 Y,然后按 Enter 键。

在 Cloud Shell 中查看应用的构建过程。此过程最多需要 10 分钟。App Engine 柔性环境会在后台自动为您预配 Compute Engine 虚拟机,接着安装应用,然后将其启动。

  1. 应用部署完成后,在网络浏览器中通过以下网址打开应用:
https://<PROJECT_ID>.appspot.com 注意:如果您忘记了 PROJECT_ID,可以在 Cloud Shell 中运行 gcloud config list project

点击下方的检查我的进度,以检查您的实验进度。

部署应用

恭喜!

恭喜!在本实验中,您学习了如何编写 Python Web 应用并将其部署到 App Engine 柔性环境中!

后续步骤/了解详情

Google Cloud 培训和认证

…可帮助您充分利用 Google Cloud 技术。我们的课程会讲解各项技能与最佳实践,可帮助您迅速上手使用并继续学习更深入的知识。我们提供从基础到高级的全方位培训,并有点播、直播和虚拟三种方式选择,让您可以按照自己的日程安排学习时间。各项认证可以帮助您核实并证明您在 Google Cloud 技术方面的技能与专业知识。

本手册的最后更新时间:2026 年 5 月 20 日

本手册的最后测试时间:2026 年 2 月 24 日

版权所有 2026 Google LLC 保留所有权利。Google 和 Google 徽标是 Google LLC 的商标。其他所有公司名和产品名可能是其各自相关公司的商标。

准备工作

  1. 实验会创建一个 Google Cloud 项目和一些资源,供您使用限定的一段时间
  2. 实验有时间限制,并且没有暂停功能。如果您中途结束实验,则必须重新开始。
  3. 在屏幕左上角,点击开始实验即可开始

使用无痕浏览模式

  1. 复制系统为实验提供的用户名密码
  2. 在无痕浏览模式下,点击打开控制台

登录控制台

  1. 使用您的实验凭证登录。使用其他凭证可能会导致错误或产生费用。
  2. 接受条款,并跳过恢复资源页面
  3. 除非您已完成此实验或想要重新开始,否则请勿点击结束实验,因为点击后系统会清除您的工作并移除该项目

此内容目前不可用

一旦可用,我们会通过电子邮件告知您

太好了!

一旦可用,我们会通过电子邮件告知您

一次一个实验

确认结束所有现有实验并开始此实验

使用无痕浏览模式运行实验

使用无痕模式或无痕浏览器窗口是运行此实验的最佳方式。这可以避免您的个人账号与学生账号之间发生冲突,这种冲突可能导致您的个人账号产生额外费用。