Menguji aplikasi web secara lokal dengan Emulator Firebase App Hosting

Anda dapat melakukan pengujian lokal aplikasi sebelum deployment App Hosting menggunakan emulator App Hosting, yang merupakan bagian dari Firebase Local Emulator Suite.

Sebelum menggunakan emulator App Hosting, pastikan Anda memahami keseluruhan alur kerja Local Emulator Suite Firebase, dan menginstal serta mengonfigurasi Local Emulator Suite dan meninjau perintah CLI-nya.

Topik ini mengasumsikan bahwa Anda sudah memahami App Hosting. Jika perlu, tinjau pengantar App Hosting dan materi lainnya untuk membantu Anda memahami cara kerja App Hosting.

Apa yang dapat saya lakukan dengan emulator App Hosting?

Emulator App Hosting memungkinkan Anda menguji dan meningkatkan kualitas aplikasi web secara lokal. Hal ini dapat menyederhanakan proses pengembangan dan meningkatkan kualitas aplikasi web yang dibuat menggunakan Firebase dan di-deploy di App Hosting.

Emulator App Hosting:

  1. Memungkinkan Anda menjalankan aplikasi web secara lokal, dengan variabel lingkungan yang ditentukan dalam file konfigurasi apphosting.yaml.
  2. Dapat mengekspor secret yang telah Anda simpan di berbagai lingkungan App Hosting, sehingga Anda dapat menyimulasikan aplikasi di berbagai lingkungan.
  3. Dapat digunakan bersama emulator Firebase lainnya. Jika Anda menggunakan Firestore, Auth, atau emulator lainnya, Local Emulator Suite akan memastikan bahwa emulator ini dimulai terlebih dahulu sebelum emulator App Hosting.

Mengonfigurasi emulator

Untuk memulai, instal dan lakukan inisialisasi Local Emulator Suite seperti yang dijelaskan di Menginstal, mengonfigurasi, dan mengintegrasikan Local Emulator Suite. Selain emulator Firebase lainnya yang ingin Anda siapkan, pastikan untuk memilih App Hosting Emulator. CLI akan meminta Anda untuk memasukkan beberapa nilai emulator App Hosting, termasuk:

  • Direktori root aplikasi Anda relatif terhadap project; hal ini penting jika Anda menggunakan monorepo dengan App Hosting.
  • Apakah Anda ingin mengekspor secret untuk lingkungan tertentu.
firebase init emulators
=== Emulators Setup
? Which Firebase emulators do you want to set up? Press Space to select emulators, then Enter to confirm your choices. (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
❯◯ App Hosting Emulator
 ◯ Firestore Emulator
 ◯ Database Emulator
 ◯ Hosting Emulator
 ◯ Pub/Sub Emulator
 ◯ Storage Emulator
 ◯ Eventarc Emulator
(Move up and down to reveal more choices)

? Specify your app's root directory relative to your project (.)

? What configs would you like to export? (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
 ❯◯ Secrets

? Which environment would you like to export secrets from Secret Manager for?:
  ◯ base (apphosting.yaml)
 ❯◯ staging (apphosting.yaml + apphosting.staging.yaml)
  ◯ preview (apphosting.yaml + apphosting.preview.yaml)

i Wrote Secrets as environment variables to apphosting.local.yaml.
i apphosting.local.yaml has been automatically added to your .gitignore.

Setiap nilai yang Anda berikan dalam alur penyiapan ini digunakan untuk memperbarui konfigurasi emulator App Hosting di firebase.json. Anda juga dapat mengonfigurasi emulator Hosting Aplikasi dengan mengupdate firebase.json secara langsung. Skema untuk emulator App Hosting adalah:

{
  ...
  "emulators": {
    "apphosting": {
      "startCommandOverride": <command> [optional]
      "rootDirectory": <path> [optional]
      }
    }
  }
  • startCommandOverride otomatis dibuat dan ditetapkan saat emulator diinisialisasi. Jika tidak disediakan, emulator akan mendeteksi dan menjalankan perintah developer pengelola paket Anda.
  • rootDirectory digunakan untuk mendukung penyiapan project monorepo. Jika aplikasi web Anda berada di subdirektori, Anda harus memberikan jalur direktori tersebut yang relatif terhadap root (lokasi firebase.json).

Mengelola emulasi

Inisialisasi emulator akan membuat file apphosting.local.yaml di direktori root aplikasi Anda. File konfigurasi ini memiliki skema yang sama dengan file apphosting.yaml yang digunakan dalam produksi, tetapi hanya ditujukan untuk pengembangan lokal. Secara default, emulator membaca konfigurasi dari file apphosting.yaml Anda, tetapi jika file apphosting.local.yaml ada, konfigurasi dalam file tersebut akan diprioritaskan dan diberi prioritas.

Mengekspor secret untuk menyimulasikan lingkungan yang berbeda secara lokal

Jika Anda menggunakan beberapa lingkungan dan ingin menyimulasikan lingkungan aplikasi yang berbeda secara lokal, Anda mungkin memerlukan secret lingkungan yang sesuai. Anda dapat mengekspor secret untuk lingkungan tertentu menggunakan perintah CLI apphosting:config:export (sebagai alternatif, seperti yang ditunjukkan dalam Mengonfigurasi emulator, Anda dapat secara opsional mengimpor secret selama inisialisasi emulator).

Perintah ini mengharuskan Anda memilih dari lingkungan App Hosting yang tersedia di project Anda. Konfigurasi App Hosting khusus lingkungan (misalnya, "apphosting.staging.yaml") dan konfigurasi App Hosting dasar ("apphosting.yaml") digabungkan, dengan konfigurasi khusus lingkungan lebih diutamakan. Jika secret dengan nama yang sama ada di kedua konfigurasi, secret dari konfigurasi khusus lingkungan akan digunakan.

Misalnya, untuk mengekspor secret ke emulator dari lingkungan staging:

firebase apphosting:config:export --project <your firebase project Id>

? What configs would you like to export? (Press
<space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
 ❯◯ Secrets

? Which environment would you like to export secrets from Secret Manager for?:
  ◯ base (apphosting.yaml)
 ❯◯ staging (apphosting.yaml + apphosting.staging.yaml)
  ◯ preview (apphosting.yaml + apphosting.preview.yaml)
i Wrote Secrets as environment variables to apphosting.local.yaml.
i apphosting.local.yaml has been automatically added to your .gitignore.

File apphosting.local.yaml Anda diperbarui (atau dibuat jika tidak ada) dengan secret yang diekspor sebagai variabel lingkungan. Karena file tersebut kini berisi informasi sensitif dalam teks biasa, file tersebut akan otomatis ditambahkan ke file .gitignore untuk mencegahnya tidak sengaja di-commit ke repositori kode sumber Anda.

Menjalankan emulator

firebase emulators:start

Tindakan ini akan memulai semua emulator yang ditentukan dalam file firebase.json, termasuk emulator App Hosting.