เชื่อมต่อแอปและเริ่มสร้างต้นแบบ


ก่อนที่จะเริ่มใช้ Firebase Local Emulator Suite โปรดตรวจสอบว่าคุณได้สร้างโปรเจ็กต์ Firebase, ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ และเลือกและติดตั้ง Firebase SDK สำหรับแพลตฟอร์มของคุณตามหัวข้อเริ่มต้นใช้งาน Firebase สำหรับแพลตฟอร์มของคุณแล้ว ได้แก่ Apple, Android หรือ Web

สร้างต้นแบบและทดสอบ

Local Emulator Suite มีโปรแกรมจำลองผลิตภัณฑ์หลายรายการตามที่อธิบายไว้ใน ข้อมูลเบื้องต้นเกี่ยวกับ Firebase Local Emulator Suite คุณสามารถสร้างต้นแบบและทดสอบด้วยโปรแกรมจำลองแต่ละรายการ รวมถึงการผสมผสานโปรแกรมจำลองต่างๆ ได้ตามต้องการ ซึ่งสอดคล้องกับผลิตภัณฑ์ Firebase ที่คุณใช้ในเวอร์ชันที่ใช้งานจริง

การโต้ตอบระหว่างฐานข้อมูล Firebase กับโปรแกรมจำลองฟังก์ชัน
ฐานข้อมูลและโปรแกรมจำลอง Cloud Functions เป็นส่วนหนึ่งของ Local Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator SuiteLocal Emulator Suite�

ในหัวข้อนี้ เพื่อเป็นการแนะนำLocal Emulator Suiteเวิร์กโฟลว์ ให้สมมติว่าคุณกำลังทำงานกับแอปที่ใช้ชุดผลิตภัณฑ์ทั่วไป ได้แก่ ฐานข้อมูล Firebase และ Cloud Functions ที่ทริกเกอร์โดยการดำเนินการในฐานข้อมูลนั้น

หลังจากเริ่มต้นโปรเจ็กต์ Firebase ในเครื่องแล้ว วงจรการพัฒนาโดยใช้ Local Emulator Suite มักจะมี 3 ขั้นตอนดังนี้

  1. สร้างต้นแบบฟีเจอร์แบบอินเทอร์แอกทีฟด้วยโปรแกรมจำลองและ Emulator Suite UI

  2. หากคุณใช้โปรแกรมจำลองฐานข้อมูลหรือCloud Functionsโปรแกรมจำลอง ให้ทำตามขั้นตอนแบบครั้งเดียวเพื่อเชื่อมต่อแอปกับโปรแกรมจำลอง

  3. ทำให้การทดสอบเป็นแบบอัตโนมัติด้วยโปรแกรมจำลองและสคริปต์ที่กำหนดเอง

เริ่มต้นโปรเจ็กต์ Firebase ในเครื่อง

โปรดตรวจสอบว่าคุณได้ติดตั้ง CLI หรือ อัปเดตเป็นเวอร์ชันล่าสุดแล้ว

curl -sL firebase.tools | bash

หากยังไม่ได้ดำเนินการ ให้เริ่มต้นไดเรกทอรีการทำงานปัจจุบันเป็นโปรเจ็กต์ Firebase โดยทำตามข้อความแจ้งบนหน้าจอเพื่อระบุว่าคุณใช้ Cloud Functions และ Cloud Firestore หรือ Realtime Database

firebase init

ตอนนี้ไดเรกทอรีโปรเจ็กต์จะมีไฟล์การกำหนดค่า Firebase, ไฟล์คำจำกัดความFirebase Security Rulesสำหรับฐานข้อมูล, ไดเรกทอรี functions ที่มีโค้ด Cloud Functions และไฟล์สนับสนุนอื่นๆ

สร้างต้นแบบแบบอินเทอร์แอกทีฟ

Local Emulator Suite ออกแบบมาเพื่อให้คุณสร้างต้นแบบฟีเจอร์ใหม่ได้อย่างรวดเร็ว และอินเทอร์เฟซผู้ใช้ในตัวของ Suite ก็เป็นหนึ่งในเครื่องมือสร้างต้นแบบที่มีประโยชน์มากที่สุด ซึ่งคล้ายกับการมีFirebaseคอนโซลที่ทำงานในเครื่อง

เมื่อใช้ Emulator Suite UI คุณสามารถทำซ้ำการออกแบบฐานข้อมูล ลองใช้ โฟลว์ข้อมูลต่างๆ ที่เกี่ยวข้องกับ Cloud Functions ประเมินการเปลี่ยนแปลงกฎความปลอดภัย ตรวจสอบบันทึกเพื่อยืนยันว่าบริการแบ็กเอนด์ทำงานอย่างไร และอื่นๆ จากนั้นหากต้องการเริ่มต้นใหม่ เพียงล้างฐานข้อมูลและเริ่มใหม่ ด้วยไอเดียการออกแบบใหม่

โดยคุณจะใช้ฟีเจอร์ทั้งหมดได้เมื่อเริ่ม Local Emulator Suite ด้วยการดำเนินการต่อไปนี้

firebase emulators:start

หากต้องการสร้างต้นแบบแอปสมมติ ให้ตั้งค่าและทดสอบฟังก์ชัน Cloud พื้นฐาน เพื่อแก้ไขรายการข้อความในฐานข้อมูล รวมถึงสร้างและป้อนข้อมูลลงในฐานข้อมูลนั้น ใน Emulator Suite UI เพื่อทริกเกอร์

  1. สร้างฟังก์ชันระบบคลาวด์ที่ทริกเกอร์โดยการเขียนฐานข้อมูลด้วยการแก้ไขไฟล์ functions/index.js ในไดเรกทอรีโปรเจ็กต์ แทนที่เนื้อหาของไฟล์ที่มีอยู่ด้วยข้อมูลโค้ดต่อไปนี้ ฟังก์ชันนี้ จะรอฟังการเปลี่ยนแปลงเอกสารในคอลเล็กชัน messages แปลงเนื้อหาของฟิลด์ original ของเอกสารเป็น ตัวพิมพ์ใหญ่ และจัดเก็บผลลัพธ์ในฟิลด์ uppercase ของเอกสารนั้น
  2.   const functions = require('firebase-functions/v1');
    
      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. เปิดใช้ Local Emulator Suite ด้วย firebase emulators:start Cloud Functions และโปรแกรมจำลองฐานข้อมูล จะเริ่มทำงานและได้รับการกำหนดค่าโดยอัตโนมัติให้ทำงานร่วมกันได้
  4. ดู UI ในเบราว์เซอร์ได้ที่ http://localhost:4000 พอร์ต 4000 เป็นค่าเริ่มต้นสำหรับ UI แต่ให้ตรวจสอบข้อความในเทอร์มินัลที่เอาต์พุตโดย Firebase CLI จดสถานะของโปรแกรมจำลองที่พร้อมใช้งาน ในกรณีของเรา โปรแกรมจำลอง Cloud Functions และ Cloud Firestore จะทำงานอยู่
    รูปภาพของฉัน
  5. ใน UI ให้คลิกแท็บ Firestore > ข้อมูล เริ่มคอลเล็กชัน แล้วทำตามข้อความแจ้งเพื่อสร้างเอกสารใหม่ใน messages คอลเล็กชัน โดยมีชื่อฟิลด์ original และค่า test ซึ่งจะทริกเกอร์ฟังก์ชันระบบคลาวด์ของเรา สังเกตว่าฟิลด์ใหม่ uppercase จะปรากฏขึ้นในไม่ช้า โดยมีสตริง "TEST"
    รูปภาพของฉัน รูปภาพของฉัน
  6. ในแท็บ Firestore > คำขอ ให้ตรวจสอบคำขอที่ส่งไปยัง ฐานข้อมูลจำลอง รวมถึงการประเมิน Firebase Security Rules ทั้งหมดที่ดำเนินการ เป็นส่วนหนึ่งของการดำเนินการตามคำขอเหล่านั้น
  7. ตรวจสอบแท็บบันทึกเพื่อให้แน่ใจว่าฟังก์ชันของคุณไม่มีข้อผิดพลาด เนื่องจากมีการอัปเดตฐานข้อมูล

คุณสามารถวนซ้ำระหว่างโค้ดฟังก์ชันระบบคลาวด์และการแก้ไขฐานข้อมูลแบบอินเทอร์แอกทีฟได้อย่างง่ายดายจนกว่าจะได้โฟลว์ข้อมูลที่ต้องการ โดยไม่ต้องแตะโค้ดการเข้าถึงฐานข้อมูลในแอป การคอมไพล์ใหม่ และการเรียกใช้ชุดทดสอบอีกครั้ง

เชื่อมต่อแอปกับโปรแกรมจำลอง

เมื่อสร้างต้นแบบแบบอินเทอร์แอกทีฟได้ดีและตัดสินใจเลือก การออกแบบแล้ว คุณก็พร้อมที่จะเพิ่มโค้ดการเข้าถึงฐานข้อมูลลงในแอปโดยใช้ SDK ที่เหมาะสม คุณจะยังคงใช้แท็บฐานข้อมูล และสำหรับฟังก์ชัน ให้ใช้แท็บบันทึกใน Emulator Suite UI เพื่อยืนยันว่าลักษณะการทำงานของแอปถูกต้อง

โปรดทราบว่า Local Emulator Suite เป็นเครื่องมือพัฒนาในเครื่อง การเขียนไปยังฐานข้อมูลเวอร์ชันที่ใช้งานจริงจะไม่ทริกเกอร์ฟังก์ชันที่คุณกำลังสร้างต้นแบบในเครื่อง

หากต้องการเปลี่ยนให้แอปเขียนไปยังฐานข้อมูล คุณจะต้อง ชี้คลาสทดสอบหรือการกำหนดค่าในแอปไปยังCloud Firestore โปรแกรมจำลอง

Kotlin
// 10.0.2.2 is the special IP address to connect to the 'localhost' of
// the host computer from an Android emulator.
val firestore = Firebase.firestore
firestore.useEmulator("10.0.2.2", 8080)

firestore.firestoreSettings = firestoreSettings {
    isPersistenceEnabled = false
}
Java
// 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);
Swift
let settings = Firestore.firestore().settings
settings.host = "127.0.0.1:8080"
settings.cacheSettings = MemoryCacheSettings()
settings.isSSLEnabled = false
Firestore.firestore().settings = settings
Unity
FirebaseFirestore db = FirebaseFirestore.DefaultInstance;
// Connects to the Firestore Emulator running on port 8080
db.Settings.Host = "127.0.0.1:8080";
db.Settings.SslEnabled = false;

Web

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

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

Web

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

ทำการทดสอบโดยอัตโนมัติด้วยสคริปต์ที่กำหนดเอง

ตอนนี้มาถึงขั้นตอนสุดท้ายของเวิร์กโฟลว์โดยรวมแล้ว เมื่อสร้างต้นแบบฟีเจอร์ในแอปและดูเหมือนว่าฟีเจอร์จะทำงานได้ดีในทุกแพลตฟอร์มแล้ว คุณก็สามารถดำเนินการติดตั้งใช้งานและการทดสอบขั้นสุดท้ายได้ สำหรับเวิร์กโฟลว์การทดสอบหน่วยและ CI คุณสามารถเริ่มโปรแกรมจำลอง เรียกใช้การทดสอบที่เขียนสคริปต์ไว้ และปิดโปรแกรมจำลองได้ในการเรียกครั้งเดียวด้วย คำสั่ง exec

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

สำรวจโปรแกรมจำลองแต่ละโปรแกรมอย่างละเอียด

ตอนนี้คุณได้เห็นเวิร์กโฟลว์ฝั่งไคลเอ็นต์พื้นฐานแล้ว คุณสามารถ ดูรายละเอียดเกี่ยวกับโปรแกรมจำลองแต่ละรายการใน Suite รวมถึงวิธี ใช้โปรแกรมจำลองเหล่านั้นในการพัฒนาแอปฝั่งเซิร์ฟเวอร์ได้

ฉันควรทำอย่างไรต่อไป

โปรดอ่านหัวข้อที่เกี่ยวข้องกับโปรแกรมจำลองที่เฉพาะเจาะจงซึ่งลิงก์อยู่ด้านบน จากนั้นให้ทำดังนี้