获取我们在 Firebase 峰会上发布的所有信息,了解 Firebase 可如何帮助您加快应用开发速度并满怀信心地运行应用。了解详情

连接您的应用并开始原型设计

在开始使用 Firebase Local Emulator Suite 之前,请确保您已经创建了一个 Firebase 项目,设置了您的开发环境,并根据适用于您的平台的Firebase 入门主题为您的平台选择并安装了 Firebase SDK: AppleAndroid网络

原型和测试

Local Emulator Suite 包含多个产品模拟器,如Firebase Local Emulator Suite 简介中所述。您可以根据您在生产中使用的 Firebase 产品,根据您认为合适的方式使用单个模拟器以及模拟器组合进行原型设计和测试。

Firebase 数据库和函数模拟器之间的交互
数据库和云功能模拟器作为完整的本地模拟器套件的一部分。

对于本主题,为了介绍 Local Emulator Suite 工作流程,假设您正在开发一个使用典型产品组合的应用程序:Firebase 数据库和由对该数据库的操作触发的云功能。

在本地初始化 Firebase 项目后,使用 Local Emulator Suite 的开发周期通常包含三个步骤:

  1. 原型功能与模拟器和 Emulator Suite UI 交互。

  2. 如果您使用的是数据库模拟器或 Cloud Functions 模拟器,请执行一次性步骤以将您的应用程序连接到模拟器。

  3. 使用模拟器和自定义脚本自动化您的测试。

本地初始化 Firebase 项目

确保安装 CLI更新到最新版本

curl -sL firebase.tools | bash

如果您尚未这样做,请将当前工作目录初始化为 Firebase 项目,按照屏幕上的提示指定您正在使用Cloud Functions以及Cloud FirestoreRealtime Database

firebase init

您的项目目录现在将包含 Firebase 配置文件、数据库的 Firebase 安全规则定义文件、包含云函数代码的functions目录以及其他支持文件。

交互式原型

Local Emulator Suite 旨在让您快速制作新功能的原型,套件的内置用户界面是其最有用的原型制作工具之一。这有点像让 Firebase 控制台在本地运行。

使用 Emulator Suite UI,您可以迭代数据库设计、尝试涉及云功能的不同数据流、评估安全规则更改、检查日志以确认后端服务的执行情况等等。然后,如果您想重新开始,只需清除数据库并从新的设计理念重新开始。

当您启动本地仿真器套件时,这一切都可用:

firebase emulators:start

为了对我们假设的应用程序进行原型设计,让我们设置并测试一个基本的云函数来修改数据库中的文本条目,并在 Emulator Suite UI 中创建和填充该数据库以触发它。

  1. 通过编辑项目目录中的functions/index.js文件来创建由数据库写入触发的云函数。将现有文件的内容替换为以下代码段。此函数侦听messages集合中文档的更改,将文档original字段的内容转换为大写,并将结果存储在该文档的uppercase字段中。
  2.   const functions = require('firebase-functions');
    
      exports.makeUppercase = functions.firestore.document('/messages/{documentId}')
          .onCreate((snap, context) => {
            const original = snap.data().original;
            console.log('Uppercasing', context.params.documentId, original);
            const uppercase = original.toUpperCase();
            return snap.ref.set({uppercase}, {merge: true});
          });
      
  3. 使用firebase emulators:start启动本地模拟器套件。 Cloud Functions 和数据库模拟器启动,自动配置为互操作。
  4. 在浏览器中的http://localhost:4000查看 UI。端口 4000 是 UI 的默认端口,但请检查 Firebase CLI 输出的终端消息。注意可用模拟器的状态。在我们的例子中,Cloud Functions 和 Cloud Firestore 模拟器将运行。
    我的形象
  5. 在 UI 中,在Firestore > Data选项卡上,单击Start collection并按照提示在messages集合中创建一个新文档,字段名original和 value test 。这触发了我们的云功能。观察很快就会出现一个新的uppercase字段,其中填充了字符串“TEST”。
    我的形象我的形象
  6. Firestore > Requests选项卡上,检查对模拟数据库发出的请求,包括作为满足这些请求的一部分执行的所有 Firebase 安全规则评估。
  7. 检查日志选项卡以确认您的函数在更新数据库时没有遇到错误。

您可以轻松地在云函数代码和交互式数据库编辑之间进行迭代,直到获得所需的数据流,而无需触及应用内数据库访问代码、重新编译和重新运行测试套件。

将您的应用程序连接到模拟器

当您在交互式原型设计方面取得良好进展并确定设计时,您就可以使用适当的 SDK 将数据库访问代码添加到您的应用程序中。您将继续使用数据库选项卡,对于函数,使用 Emulator Suite UI 中的日志选项卡来确认您的应用程序的行为是否正确。

请记住,Local Emulator Suite 是一种本地开发工具。写入生产数据库不会触发您在本地进行原型设计的功能。

要切换到让您的应用写入数据库,您需要将测试类或应用内配置指向 Cloud Firestore 模拟器。

安卓
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
FirebaseFirestore firestore = FirebaseFirestore.getInstance();
firestore.useEmulator("10.0.2.2", 8080);

FirebaseFirestoreSettings settings = new FirebaseFirestoreSettings.Builder()
        .setPersistenceEnabled(false)
        .build();
firestore.setFirestoreSettings(settings);
迅速
let settings = Firestore.firestore().settings
settings.host = "localhost:8080"
settings.isPersistenceEnabled = false 
settings.isSSLEnabled = false
Firestore.firestore().settings = settings

Web version 9

import { getFirestore, connectFirestoreEmulator } from "firebase/firestore";

// firebaseApps previously initialized using initializeApp()
const db = getFirestore();
connectFirestoreEmulator(db, 'localhost', 8080);

Web version 8

// Firebase previously initialized using firebase.initializeApp().
var db = firebase.firestore();
if (location.hostname === "localhost") {
  db.useEmulator("localhost", 8080);
}

使用自定义脚本自动化您的测试

现在是最后一个整体工作流程步骤。一旦您在应用程序中对您的功能进行了原型设计并且它在您的所有平台上看起来很有希望,您就可以转向最终实施和测试。对于单元测试和 CI 工作流程,您可以使用exec命令在一次调用中启动模拟器、运行脚本测试和关闭模拟器:

firebase emulators:exec "./testdir/test.sh"

更深入地探索单个模拟器

现在您已经了解了基本客户端工作流程的样子,您可以继续了解套件中各个模拟器的详细信息,包括如何将它们用于服务器端应用程序开发:

接下来是什么?

请务必阅读与上面链接的特定模拟器相关的主题。然后: