使用 Data Connect 的 AI 辅助功能

使用 Gemini in Firebase 帮助为客户端代码设计架构、查询和变更。

使用自然语言描述您的应用、数据模型或所需的查询/变更,Gemini in Firebase 会生成相应的 Data Connect

此 AI 辅助功能可在以下开发环境中提供:

  • Firebase 控制台中,您可以生成、测试和部署架构和操作。
  • 在本地环境中,您可以使用 Firebase CLI 和 Data Connect VS Code 扩展程序,通过模拟器生成、测试和开发应用。
  • AI 赋能的开发工具可以使用 Firebase MCP 服务器来生成、测试和开发应用。

如需详细了解Data Connect 架构查询变更语法,请参阅相关指南。

AI assistance for Data Connect会如何使用您的数据

如需了解详情,请参阅 Gemini in Firebase 如何使用您的数据

设置 AI assistance for Data Connect

如需将 AI 辅助功能与 Data Connect 搭配使用,请按照设置 Gemini in Firebase 中的说明启用 Gemini in Firebase

使用 Gemini in Firebase 生成架构、查询和变更

您可以在许多工作流程中使用 AI 辅助功能来处理 Data Connect

Firebase 控制台中

创建 Data Connect 服务时,Firebase 控制台会提供“Gemini 使用入门”体验。

您可以描述应用创意,然后 AI 助理会生成以下内容:

  • 根据您的应用创意生成的完整架构。
  • 操作和数据突变的示例。

在数据页面中,您可以使用帮我写 GraphQLpen_spark 按钮,根据自然语言生成和执行操作。查看一些使用情形示例

我们的入门指南中介绍了此工作流程。您可以在本地开发环境中继续使用已部署的架构和操作。

在本地环境中

您还可以通过 Firebase CLI 和 Data Connect VS Code 扩展程序获取 AI 辅助功能。

您可以向 firebase init dataconnect 提供应用创意,然后它会生成以下内容:

  • 根据您的应用创意生成的完整架构。
  • 示例操作和种子数据突变。

Data Connect VS Code 扩展程序提供以下功能:

  • 生成/优化操作 Code Lens,用于将 GraphQL 注释转换为 Data Connect 操作。
  • Gemini Code Assist 和 Firebase MCP 服务器无缝集成。

我们的本地原型设计入门指南中介绍了此工作流。

将 Firebase MCP 服务器与 AI 赋能的开发工具搭配使用

Firebase MCP 服务器可与任何可充当 MCP 客户端的 AI 助理工具配合使用,包括 Gemini CLI、Gemini Code Assist、Cursor、Visual Studio Code Copilot、Claude Desktop 和 Windsurf Editor。

Firebase MCP 服务器可提供额外的上下文和功能,帮助 AI 赋能的开发工具更好地与 Data Connect 协同工作。它可以执行以下操作:

  • 设置新的项目目录和生成的 SDK。
  • 根据编译错误构建和迭代架构、操作。
  • 根据需求生成新的架构和操作。
  • 针对本地模拟器或后端服务生成并执行操作。
  • 收集有关现有服务的信息。

如需使用 Firebase MCP 服务器,请执行以下操作:

  1. 按照此指南设置 MCP 客户端。
  2. 询问与 Data Connect 相关的问题。示例提示:
    1. “为披萨配送应用设置 Data Connect 项目。”
    2. “修复了 Data Connect 编译错误。”
    3. “在首页中,我需要显示活跃的聊天室和好友列表。 生成一个Data Connect查询。”
    4. “我的本地 Data Connect 模拟器中有哪些用户?”
    5. “我的 Data Connect 服务位于哪些 Google Cloud 区域?”

生成操作的用例示例

以下部分介绍了示例使用场景:

按评分降序返回前五部电影

如需使用 AI assistance for Data Connect 基于自然语言生成 GraphQL,请执行以下操作:

  1. 在项目中打开 Data Connect,然后在服务下选择您的数据源。

  2. 点击数据

  3. 点击帮我写 GraphQLpen_spark 图标。以自然语言描述您希望生成的查询变更,然后点击生成

    例如,如果您使用的是“使用 Data Connect (Web) 构建”Codelab 中引用的电影数据源,则可以提出以下问题:“返回 2022 年排名前五位的电影,按评分降序顺序排列”,这可能会返回如下结果:

    query TopMovies2022 {
      movies(where: {releaseYear: {eq: 2022}}, orderBy: [{rating: DESC}], limit: 5) {
        id
        title
        rating
        releaseYear
      }
    }
    
  4. 查看回答:

    • 如果回答看起来正确无误,请点击插入,将该回答插入到代码编辑器中。
    • 如果可以对回答进行优化,请点击修改,更新提示,然后点击重新生成
  5. 在接受该回答后,如果适用,请在参数部分中设置以下内容:

    • 变量:如果查询或变更包含变量,请在此处定义它们。使用 JSON 定义它们,例如 {"title":"The Matrix", "releaseYear":"1999"}
    • 授权:选择用于运行查询或变更的授权上下文(已通过身份验证的管理员或未通过身份验证的管理员)。
  6. 点击代码编辑器中的运行,然后查看结果。

如需在代码编辑器中测试多个查询或变更,请确保为它们命名。例如,以下查询命名为 GetMovie。将光标移至查询或变更的第一行,以激活运行按钮。

query GetMovie($myKey: Movie_Key!) {
  movie(key: $myKey) { title }
}

创建一种根据用户输入向数据库添加电影的 mutation

此示例展示了如何使用自然语言生成用于填充数据库的 GraphQL mutation。此示例假定您使用的是Firebase Data Connect 文档“使用 Data Connect (Web) 构建”Codelab 中使用的电影数据库架构。

  1. Firebase 控制台中,打开 Data Connect

  2. 选择您的服务和数据源,然后打开数据标签页。

  3. 点击帮我写 GraphQLpen_spark 图标,然后描述您的突变:

    Create a movie based on user input.
    
  4. 点击生成。返回相应变异。例如,Gemini 可能会返回如下突变:

    mutation CreateMovie($title: String!, $releaseYear: Int!, $genre: String!, $rating: Float!, $description: String!, $imageUrl: String!, $tags: [String!] = []) @auth(level: USER) {
      movie_insert(data: {
        title: $title,
        releaseYear: $releaseYear,
        genre: $genre,
        rating: $rating,
        description: $description,
        imageUrl: $imageUrl,
        tags: $tags
      })
    }
    
  5. 查看输出。如果需要,请点击修改以优化提示,然后点击重新生成

  6. 接下来,点击插入,将变异插入到数据编辑器中。

  7. 如需执行突变,您需要添加变量。在参数部分中,打开变量并添加一些测试变量:

    {"title":"My amazing movie", "releaseYear":2024, "genre": "Comedy",
    "rating": 8, "description": "A new movie to test mutations",
    "imageUrl": "", "tags": ["comedy","space travel"]}
    
  8. 点击运行

  9. 接下来,创建一个查询来验证您的电影是否已添加。点击帮我写 GraphQL pen_spark,然后在随即显示的框中输入提示:

    List all movies from 2024 that include all of these tags: 'space travel', 'comedy'.
    

    Gemini 可能会返回如下所示的回答:

    query ComedySpaceTravelMovies2024 @auth(level: PUBLIC) {
      movies(
        where: {
        releaseYear: { eq: 2024 },
        tags: { includesAll: ["space travel", "comedy"] }
        }
      ) {
          id
          title
          imageUrl
          releaseYear
          genre
          rating
          description
          tags
        }
    }
    
  10. 插入并运行查询。您添加的电影应显示在历史记录字段中。

创建根据用户提供的类型和评分列出评价的查询

此示例展示了如何使用自然语言生成 GraphQL 查询。此示例假定您使用的是 Firebase Data Connect 文档“使用 Data Connect (Web) 构建”Codelab 中使用的电影数据库。

  1. Firebase 控制台中,打开 Data Connect

  2. 选择您的服务和数据源,然后打开数据标签页。

  3. 点击帮我写 GraphQLpen_spark 图标,然后描述您的查询:

    List all movie reviews, based on user-configurable genre and ratings.
    
  4. 点击生成。系统会返回查询。例如,Gemini 可能会返回如下查询:

    query ListReviewsByGenreAndRating($genre: String, $minRating: Int, $maxRating: Int) @auth(level: PUBLIC) {
      reviews(where: {
        movie: {
          genre: {eq: $genre}
        },
        rating: {ge: $minRating, le: $maxRating}
      }) {
        id
        user {
          username
        }
        movie {
          title
          genre
        }
        rating
        reviewText
        reviewDate
      }
    }
    
  5. 查看输出。如果需要,请点击修改以优化提示,然后点击重新生成

  6. 接下来,点击插入,将变异插入到数据编辑器中。

  7. 如需测试此查询,您需要添加变量。在参数部分中,打开变量,并添加要用于测试的变量:

    {"genre":"sci-fi", "minRating":4, "maxRating":9}
    
  8. 点击运行

为第三方 AI 辅助工具设计提示

与所有 AI 辅助工具一样,提示写得越好,输出结果就越有用。

当您在 Firebase 中向 Gemini 提供自然语言提示时,在幕后,助理会将您的输入内容翻译成更完善的提示。

如果您使用的是 Cursor 或 Windsurf 等第三方 AI 工具,则可以使用类似但更详细的提示来获得更出色的 Data Connect 建议。

我们发布了提示模板,供您下载、调整和复制到 IDE 中:

下载并修改后,在熟悉的工具(例如 Cursor 或 Windsurf)中创建提示,如下所示:

  • 在 Cursor 中(请务必查看 Cursor 的最新说明):

    1. 点击右上角的“设置”图标。
    2. 选择规则标签页。
    3. 项目规则下,点击添加新规则按钮。
    4. 复制并粘贴规则。
  • 在 Windsurf 中(请务必查看 Windsurf 的最新说明):

    1. 点击右上角的层叠按钮,打开“层叠”窗口。
    2. 在 Cascade 中,点击右上角滑动菜单中的自定义图标,然后前往规则面板。
    3. 点击 + 全局+ 工作区按钮,分别在全局或工作区级别创建新规则。
    4. 复制并粘贴规则。

AI assistance for Data Connect 问题排查

请参阅排查 Gemini in Firebase 问题

价格

AI assistance for Data Connect 作为 Gemini in Firebase 的一部分提供,并且包含在个人用户方案中。

如需了解详情,请参阅 Gemini in Firebase 价格

后续步骤