在本地开始使用 Firebase Data Connect

在本快速入门中,您将了解如何在本地应用中构建 Firebase Data Connect,而无需设置生产 SQL 实例。

  • Firebase Data Connect 添加到您的 Firebase 项目中。
  • 设置一个开发环境,其中包含一个 Visual Studio Code 扩展程序,以便与本地实例搭配使用。
  • 然后,我们会介绍如何执行以下操作: <ph type="x-smartling-placeholder">
      </ph>
    • 为电影应用创建架构
    • 定义将在您的应用中使用的查询和变更
    • 使用针对本地模拟器的示例数据测试您的查询和变更
    • 生成强类型 SDK 并在您的应用中使用它们
    • 将最终架构、查询和数据部署到云端(可选,需要 Blaze 方案)。

前提条件

如需使用本快速入门,您需要做好以下准备。

设置开发环境

您需要使用 Visual Studio Code 来管理架构并定义将在应用中使用的查询,系统会自动为您生成一个强类型 SDK:

  1. 为您的本地项目创建一个新目录。
  2. 在新目录中打开 VS Code。
  3. 从以下位置安装 Firebase Data Connect 扩展程序: Visual Studio Code Marketplace

设置项目目录

如需设置本地项目,请初始化您的项目目录。在 VS Code 中 左侧面板中,点击 Firebase 图标以打开 Data Connect VS Code 扩展程序界面:

  1. 点击使用 Google 账号登录按钮。
  2. 点击关联 Firebase 项目按钮,然后在控制台中选择您之前创建的项目。
  3. 点击运行 Firebase init 按钮。
  4. 点击启动模拟器按钮。

创建架构

在 Firebase 项目目录的 /dataconnect/schema/schema.gql 文件中 开始定义关于电影的 GraphQL 架构。

电影

Data Connect 中,GraphQL 字段会映射到列。电影包含 idtitleimageUrlgenreData Connect 可识别基元 数据类型:StringUUID

复制以下代码段或取消对文件中的相应行的注释。

# By default, a UUID id key will be created by default as primary key.
# If you want to specify a primary key, say title, which you can do through
# the @table(key: "title") directive
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

电影元数据

复制以下代码段或取消对文件中的相应行的注释。

# Movie - MovieMetadata is a one-to-one relationship
type MovieMetadata @table {
  # This time, we omit adding a primary key because
  # you can rely on Data Connect to manage it.

  # @unique indicates a 1-1 relationship
  movie: Movie! @unique
  # movieId: UUID <- this is created by the above reference
  rating: Float
  releaseYear: Int
  description: String
}

请注意,movie 字段会映射到 Movie 类型。 Data Connect 了解这是 MovieMovieMetadata 之间的关系,并会为您管理这项关系。

在文档中详细了解 Data Connect 架构

将数据添加到表中

在 VS Code 编辑器面板中,您会看到 CodeLens 按钮显示在 /dataconnect/schema/schema.gql 中的 GraphQL 类型上方。您可以使用添加数据运行(本地)按钮可将数据添加到本地数据库。

如需将记录添加到 MovieMovieMetadata 表,请执行以下操作:

  1. schema.gql 中,点击 Movie 类型上方的添加数据按钮 。
    适用于 Firebase Data Connect 的代码智能镜头“添加数据”按钮
  2. 在生成的 Movie_insert.gql 文件中,为 三个字段。
  3. 点击 Run (Local) 按钮。
    Firebase Data Connect 的 Code Lens“Run”按钮
  4. 重复上述步骤,将记录添加到 MovieMetadata 表中,在 movie 字段中提供电影的 uid,如生成的 MovieMetadata_insert 更改中所提示。

如需快速验证是否添加了数据,请执行以下操作:

  1. 返回 schema.gql,点击读取数据按钮。
  2. 在生成的 Movie_read.gql 文件中,点击 Run (Local) 按钮以 执行该查询。

参阅文档详细了解 Data Connect 更改

定义查询

现在进入有趣的部分:我们来定义应用中需要的查询。 作为开发者,您可能习惯编写 SQL 查询,而不是 GraphQL 查询,因此这可能在开始时会有些不同。然而,GraphQL 比原始 SQL 更为简洁和类型安全。还有我们的 VS Code 扩展程序可简化开发体验。

开始修改 /dataconnect/connector/queries.gql 文件。如果您想获取所有电影,请使用如下查询。

# File `/dataconnect/connector/queries.gql`

# @auth() directives control who can call each operation.
# Anyone should be able to list all movies, so the auth level is set to PUBLIC
query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
  }
}

使用附近的 CodeLens 按钮执行查询。

这里有一个非常令人兴奋的功能,就是能够处理数据库的 就像图表一样。由于 MovieMetadata 包含引用电影的 movie 字段,因此您可以嵌套到该字段中,然后获取电影信息的相关信息。尝试将生成的类型 movieMetadata_on_movie 添加到 ListMovies 查询。

query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
    movieMetadata_on_movie {
        rating
    }
  }
}

参阅文档,详细了解 Data Connect 查询

生成 SDK 并在应用中使用

在 VS Code 左侧面板中,点击 Firebase 图标以打开 Data Connect VS Code 扩展程序界面:

  1. 点击向应用添加 SDK 按钮。
  2. 在随即显示的对话框中,选择包含应用代码的目录。Data Connect系统将生成 SDK 代码 保存在这里

  3. 选择您的应用平台,然后请注意,SDK 代码会立即 该文件是在您选择的目录中生成的

了解如何使用生成的 SDK 从客户端应用(WebAndroidiOSFlutter)调用查询和更改。

将架构和查询部署到生产环境

对应用进行本地设置后,就可以部署 架构、数据和查询迁移到云端。你需要 Blaze 方案才能设置 Cloud SQL 实例。

  1. 前往 Firebase 控制台的 Data Connect 部分,然后创建 一个 Cloud SQL 实例免费试用。

  2. 在 VS Code 集成的终端中,运行 firebase init dataconnect 并 选择您刚刚在控制台中创建的区域/服务 ID

  3. 出现提示时,选择 “Y” “File dataconnect/dataconnect.yaml” 是否覆盖?”

  4. 在 Data Connect VS Code 扩展程序界面中,点击部署到生产环境 按钮。

  5. 部署后,转到 Firebase 控制台 验证架构、操作和数据是否已上传到云端。您 应该能够查看架构,并以 。Cloud SQL for PostgreSQL 实例将更新为其最终实例, 部署生成的架构和数据

后续步骤

查看已部署的项目并探索更多工具:

  • Firebase 控制台中向数据库添加数据、检查和修改架构,以及监控 Data Connect 服务。

如需了解详情,请参阅相关文档。例如,既然您已完成快速入门,请执行以下操作: