Uygulama dağıtımınızı yerel olarak test etme

Firebase Local Emulator Suite'in bir parçası olan App Hosting emülatörünü kullanarak uygulamanızı App Hosting dağıtımından önce yerel olarak test edebilirsiniz.

App Hosting emülatörünü kullanmadan önce genel Firebase Local Emulator Suite iş akışını anladığınızdan, Local Emulator Suite'yi yükleyip yapılandırdığınızdan ve CLI komutlarını incelediğinizden emin olun.

Bu konuda, App Hosting hakkında bilgi sahibi olduğunuz varsayılmaktadır. Gerekirse App Hosting'ın işleyiş şeklini anlamanıza yardımcı olacak App Hosting tanıtımını ve diğer materyalleri inceleyin.

App Hosting emülatörüyle neler yapabilirim?

App Hosting emülatörü, web uygulamalarınızı yerel olarak test etmenize ve hassaslaştırmanıza olanak tanır. Bu sayede geliştirme sürecinizi kolaylaştırabilir ve Firebase kullanılarak oluşturulup App Hosting üzerinde dağıtılan web uygulamalarının kalitesini artırabilirsiniz.

App Hosting emülatörü:

  1. Web uygulamanızı, apphosting.yaml yapılandırma dosyalarında tanımlanan ortam değişkenleri ve gizli anahtarlarla yerel olarak çalıştırmanıza olanak tanır.
  2. apphosting.emulator.yaml dosyasıyla emülatörde kullanılacak ortam değişkenlerini ve gizli anahtarları geçersiz kılabilir.
  3. Diğer Firebase emülatörleriyle birlikte kullanılabilir. Firestore, Auth veya başka bir emülatör kullanıyorsanız Local Emulator Suite, bu emülatörlerin App Hosting emülatöründen önce başlatılmasını sağlar.

Emülatörü yapılandırma

Başlamak için Local Emulator Suite'i yükleme, yapılandırma ve entegre etme başlıklı makalede açıklandığı şekilde Local Emulator Suite aracını yükleyip ilk kullanıma hazırlayın. Kurmak istediğiniz diğer Firebase emülatörlerine ek olarak App Hosting Emulator emülatörünü de seçtiğinizden emin olun. CLI, aşağıdakiler de dahil olmak üzere bazı App Hosting emülatör değerlerini girmenizi ister:

  • Uygulamanızın projeye göre kök dizini. App Hosting ile monorepo kullanıyorsanız bu önemlidir.
  • Yerel geliştirme için herhangi bir değeri geçersiz kılmak isteyip istemediğiniz.
  • Ekip arkadaşlarınıza yerel geliştirme için gizli anahtarlara erişim izni vermek isteyip istemediğiniz
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 (./)

? The App Hosting emulator uses a file called apphosting.emulator.yaml to
override values in apphosting.yaml for local testing. This codebase does not
have one, would you like to create it? (Y/n)

? Which environment variables would you like to override? (Press <space> to
select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
❯◯ MEMCACHE_ADDR
 ◯ API_KEY

? What new value would you like for plaintext MEMCACHE_ADDR?

? What would you like to name the secret reference for API_KEY? (test-api-key)

? What new value would you like for secret TESTKEY [input is hidden]? [input is hidden]

? Your config has secret values. Please provide a comma-separated list of users
or groups who should have access to secrets for local development:

✔  Successfully set IAM bindings on secret test-api-key.

Bu kurulum akışında sağladığınız tüm değerler, firebase.json uygulamasındaki App Hosting emülatör yapılandırmanızı güncellemek için kullanılır. App Hosting emülatörünü doğrudan firebase.json dosyasını güncelleyerek de yapılandırabilirsiniz. App Hosting emülatörünün şeması şu şekildedir:

{
  ...
  "emulators": {
    "apphosting": {
      "startCommand": <command> [optional],
      "rootDirectory": <path> [optional]
    }
  }
}
  • startCommand, emülatör başlatıldığında otomatik olarak oluşturulur ve ayarlanır. Belirtilmezse emülatör, paket yöneticinizin geliştirme komutunu algılar ve çalıştırır.
  • rootDirectory, monorepo proje kurulumlarını desteklemek için kullanılır. Web uygulamanız bir alt dizindeyse bu dizinin köke (firebase.json konumuna) göre yolunu belirtmeniz gerekir.

Emülasyonu yönetme

Emülatör başlatma işlemi, uygulamanızın kök dizininde bir apphosting.emulator.yaml dosyası oluşturur. Bu yapılandırma dosyası, üretimde kullanılan apphosting.yaml dosyasıyla aynı şemaya sahiptir ancak yalnızca yerel geliştirme için tasarlanmıştır. Emülatör, varsayılan olarak yapılandırmayı apphosting.yaml dosyanızdan okur ancak bir apphosting.emulator.yaml dosyası varsa bu dosyadaki yapılandırmalara öncelik verilir.

apphosting.emulator.yaml dosyası, güvenli bir şekilde kaydedilip iş arkadaşlarıyla paylaşılacak şekilde tasarlanmıştır. Hassas verileri yanlışlıkla kaynak depolarına kaydetmenizi önlemek için apphosting.yaml ortamında gizli olan tüm ortam değişkenleri apphosting.emulator.yaml ortamında da gizli olmalıdır. Bir gizli anahtarın üretim ve yerel geliştirme arasında değişmesi gerekmiyorsa (örneğin, Gemini API anahtarı) apphosting.emulator.yaml dosyasına eklenmesi gerekmez. Bunun yerine ekibinize gizli anahtara erişim izni verin.

Uygulamanız çok sayıda gizli anahtar kullanıyorsa (örneğin, üretim, hazırlık ve yerel geliştirme için farklı değerlere sahip üç farklı hizmetin API anahtarları) Cloud Secret Manager'ın ücretsiz katmanını aşabilir ve ek gizli anahtar başına ayda 0,06 ABD doları ödeyebilirsiniz. Bu ücreti ödememek için yerel yapılandırmayı kaynak denetimi dışında yönetmeyi tercih ederseniz eski apphosting.local.yaml dosyasını kullanabilirsiniz. apphosting.emulator.yaml dosyasının aksine bu dosya, apphosting.yaml dosyasında gizli değerler olan ortam değişkenleri için düz metin değerleri sağlayabilir.

Kullanıcılara veya gruplara gizli anahtarlara erişim izni verme

apphosting.emulator.yaml içinde depolanan gizli anahtarlar, emülatör başlatıldığında okunur. Bu, geliştirme ekibinizin gizli anahtara erişmesi gerektiği anlamına gelir. E-posta yoluyla bir kullanıcıya veya gruba gizli anahtar erişimi vermek için apphosting:secrets:grantaccess komutunu kullanabilirsiniz.

firebase apphosting:secrets:grantaccess test-api-key --emails my-team@my-company.com

Uygun durumlarda, apphosting.emulator.yaml içinde üretim verilerine erişimi olmayan, genel yan etkileri (e-posta gönderme, kredi kartlarından ödeme alma) bulunmayan veya daha düşük kotalara sahip, yalnızca test amaçlı anahtarlar kullanmayı düşünün. Bu sayede, incelenmemiş kodun gerçek dünyada daha az soruna yol açması sağlanır.

Gizli anahtarlara erişimi tek tek kullanıcılara vermek yerine Google Gruplar'ı kullanarak yönetmeyi tercih edin. Bu sayede, geliştirici ekibinize yeni üyeler eklemek daha kolay hale gelir. Yeni üyeleri gruba eklediğinizde, ihtiyaç duydukları tüm gizli anahtarlara erişim izni verilir. Geliştiricilerin birbirleriyle iletişim kurduğu uygun bir grubunuz zaten olabilir. Google Gruplar ile erişimi kontrol etmek, ekibinizden ayrılan geliştiricilerin e-posta grubundan çıkarıldıklarında tüm gizli anahtarlara erişimlerini kaybetmelerini de sağlar. Gizli anahtarın üretim verilerine veya gerçek dünyadaki yan etkilere erişimi varsa anahtarınızı değiştirmeniz ve firebase apphosting:secrets:set ile yeni bir değer vermeniz yine de uygun olabilir.

Emülatörü çalıştırma

firebase emulators:start

Bu işlem, App Hosting emülatörü de dahil olmak üzere firebase.json dosyanızda tanımlanan tüm emülatörleri başlatır.

Angular uygulamaları için start komutunu yapılandırma

"emulator start" komutu zaman aşımına uğrarsa Angular geliştirme sunucusu, uygulamanızı App Hosting emülatörünün beklediğinden farklı bir bağlantı noktasında sunuyor olabilir. firebase.json dosyasına ek yapılandırma ekleyerek bu sorunu çözebilirsiniz:

  • emulators.apphosting.startCommand değerini ng serve olarak ayarlayın.
  • Varsayılan olmayan bir bağlantı noktası kullanmak için emulators.apphosting.port ile ayarlayın (emulators.apphosting.startCommand içindeki ng serve'ye --port işaretini eklemek yerine).

Örneğin:

"emulators": {
    "apphosting": {
      "port": 5002,
      "rootDirectory": "./test-app",
      "startCommand": "ng serve"
    },
    "ui": {
      "enabled": true
    },
    ...
  }