Web uygulamalarını izleme ve koruma

Uygulamalarınızı yayınladıktan sonra izlemeniz ve güvenliğini sağlamanız gerekir:

App Hosting gözlemlenebilirlik ile sitenizin performansını izleme

Firebase Studio uygulamasındaki Uygulamaya genel bakış panelinde, uygulamanızla ilgili temel metrikler ve bilgiler yer alır. Bu sayede, App Hosting uygulamasının yerleşik gözlemlenebilirlik araçlarını kullanarak web uygulamanızın performansını izleyebilirsiniz. Siteniz kullanıma sunulduktan sonra Yayınla'yı tıklayarak genel bakışa erişebilirsiniz. Bu panelde yapabilecekleriniz:

  • Uygulamanızın yeni bir sürümünü yayınlamak için Yayınla'yı tıklayın.
  • Uygulamanızın bağlantısını paylaşın veya uygulamanızı doğrudan Uygulamanızı ziyaret edin bölümünde açın.
  • Uygulamanızın son 7 gündeki performansının özetini inceleyin. Bu özette, toplam istek sayısı ve son kullanıma sunma işleminizin durumu da yer alır. Firebase konsolunda daha fazla bilgiye erişmek için Ayrıntıları göster'i tıklayın.
  • Uygulamanızın son 24 saat içinde aldığı istek sayısının HTTP durum koduna göre dökümünü gösteren grafiği görüntüleyin.
  • Firebase Authentication ve Cloud Firestore gibi Firebase hizmetlerinin etkinleştirme durumunu görüntüleme

Uygulamaya genel bakış panelini kapatırsanız Yayınla'yı tıklayarak istediğiniz zaman yeniden açabilirsiniz.

App Hosting kullanıma sunma süreçlerini yönetme ve izleme hakkında daha fazla bilgi için Kullanıma sunma süreçlerini ve sürümleri yönetme başlıklı makaleyi inceleyin.

Dağıtılan özellikleriniz için Genkit izleme

Yapay zeka akış kodunuzda telemetriyi etkinleştirerek Genkit özelliğinizin adımlarını, girişlerini ve çıkışlarını izleyebilirsiniz. Genkit için telemetri özelliği, yapay zeka akışlarınızın performansını ve kullanımını izlemenize olanak tanır. Bu veriler, iyileştirme alanlarını belirlemenize, sorunları gidermenize, istemlerinizi ve akışlarınızı daha iyi performans ve maliyet verimliliği için optimize etmenize ve akışlarınızın kullanımını zaman içinde izlemenize yardımcı olabilir.

Genkit uygulamasında izlemeyi ayarlamak için Genkit AI akışlarına telemetri ekler ve ardından sonuçları Firebase konsolunda görüntülersiniz.

1. adım: Firebase Studio dilindeki Genkit akış kodunuza telemetri ekleyin

Kodunuzda izlemeyi ayarlamak için:

  1. Code görünümünde değilseniz açmak için Kod değiştirme
simgesi Koda geç'i tıklayın.

  2. Yüklü Genkit sürümünü doğrulamak için package.json sayfasını kontrol edin.

  3. Terminali açın (Ctrl-Shift-C veya MacOS'te Cmd-Shift-C).

  4. Terminali tıklayın ve package.json dosyanızla eşleşen sürümü kullanarak Firebase eklentisini yükleyin. Örneğin, package.json uygulamanızdaki Genkit paketleri 1.0.4 sürümündeyse eklentiyi yüklemek için aşağıdaki komutu çalıştırmanız gerekir:

    npm i --save @genkit-ai/firebase@1.0.4
  5. Gezgin'den src > ai > flows öğesini genişletin. Genkit akışlarınızı içeren bir veya daha fazla TypeScript dosyası flows klasöründe görünür.

  6. Açmak istediğiniz akışlardan birini tıklayın.

  7. Dosyanın içe aktarma bölümünün en altına, FirebaseTelemetry öğesini içe aktarmak ve etkinleştirmek için aşağıdakileri ekleyin:

    import { enableFirebaseTelemetry } from '@genkit-ai/firebase';
    
    enableFirebaseTelemetry();
    

2. adım: İzinleri ayarlayın

Firebase Studio, Firebase projenizi oluştururken gerekli API'leri sizin için etkinleştirdi ancak App Hosting hizmet hesabına da izin vermeniz gerekiyor.

İzinleri ayarlamak için:

  1. Google Cloud konsolunda IAM sayfasına gidin ve Firebase projenizi seçin.

  2. App Hosting hizmet hesabına aşağıdaki rolleri verin:

    • İzleme Metriği Yazarı (roles/monitoring.metricWriter)
    • Cloud Trace Agent (roles/cloudtrace.agent)
    • Günlük Yazarı (roles/logging.logWriter)
  3. App Hosting için uygulamanızı yeniden yayınlayın.

  4. Yayınlama işlemi tamamlandığında uygulamanızı yükleyip kullanmaya başlayın. Beş dakika sonra uygulamanız telemetri verilerini kaydetmeye başlar.

3. adım: Firebase konsolunda üretken yapay zeka özelliklerinizi izleyin

Telemetri yapılandırıldığında Genkit tüm akışlarınız için istek sayısını, başarıyı ve gecikmeyi kaydeder. Ayrıca her akış için Genkit kararlılık metriklerini toplar, ayrıntılı grafikler gösterir ve yakalanan izleri günlüğe kaydeder.

Genkit ile uygulanan yapay zeka özelliklerinizi izlemek için:

  1. Beş dakika sonra Firebase konsolunda AI Services > Genkit'e giderek Genkit'ten gelen istemleri ve yanıtları inceleyin.

  2. Genkit tarafından derlenen aşağıdaki kararlılık metriklerini inceleyebilirsiniz:

    • Toplam istek sayısı: Akışınız tarafından alınan toplam istek sayısı.
    • Başarı oranı: Başarıyla işlenen isteklerin yüzdesi.
    • 95. yüzdelik dilim gecikmesi: Akışınızın 95. yüzdelik dilim gecikmesi. Bu, isteklerin %95'inin işlenmesi için gereken süredir.
    • Jeton kullanımı:

      • Giriş jetonları: İstemde modele gönderilen jeton sayısı.
      • Çıkış jetonları: Model tarafından yanıtta oluşturulan jetonların sayısı.
    • Resim kullanımı:

      • Giriş resimleri: İstemde modele gönderilen resimlerin sayısı.
      • Çıkış görüntüleri: Yanıtta model tarafından oluşturulan görüntülerin sayısı.
  3. Kararlılık metriklerini genişleterek aşağıdaki ayrıntılı grafikleri görüntüleyebilirsiniz:

    • Zaman içindeki istek hacmi.
    • Zaman içindeki başarı oranı.
    • Zaman içinde giriş ve çıkış jetonları.
    • Zaman içinde gecikme (95. ve 50. yüzdelik dilim).

Genkit hakkında daha fazla bilgiyi belgelerinde bulabilirsiniz.

Uygulamanızı Firebase App Check ile koruma

Uygulamanıza Firebase veya Google Cloud hizmetlerini entegre ettiyseniz Firebase App Check, yetkisiz istemcilerin Firebase kaynaklarınıza erişmesini engelleyerek uygulama arka uçlarınızı kötüye kullanıma karşı korumaya yardımcı olur. Kaynaklarınızı güvende tutmak için hem Google hizmetleriyle (Firebase ve Google Cloud hizmetleri dahil) hem de kendi özel arka uçlarınızla çalışır.

Arka uç kaynaklarınızı kötüye kullanıma karşı korumak için herkese açık olarak yayınladığınız tüm uygulamalara App Check eklemenizi öneririz.

Bu bölümde, App Prototyping agent tarafından oluşturulan bir web uygulaması için reCAPTCHA Enterprise'ı kullanarak Firebase Studio içinde App Check'i nasıl ayarlayacağınız açıklanmaktadır. Ancak App Check'i, Firebase hizmetlerini uygulayan ve özel sağlayıcılar uygulayabilen herhangi bir uygulamada ayarlayabilirsiniz. Daha fazla bilgiyi Firebase App Check adresinde bulabilirsiniz.

reCAPTCHA Enterprise, 10.000'e kadar ücretsiz değerlendirme sunar.

1. adım: Uygulamanız için reCAPTCHA Enterprise'ı ayarlayın

  1. Google Cloud konsolunun reCAPTCHA Enterprise bölümünü açın.

  2. Google Cloud konsolu proje seçicisinden Firebase projenizin adını seçin.

  3. reCAPTCHA Enterprise API'yi etkinleştirmeniz istenirse etkinleştirin.

  4. Başlayın'ı tıklayın ve reCAPTCHA site anahtarınız için bir Görünen ad ekleyin.

  5. Varsayılan Web Application type (Uygulama türü) anahtarını kabul edin.

  6. Alan ekle'yi tıklayın ve bir alan ekleyin. App Hosting alanınızı (ör. studio--PROJECT_ID.REGION.hosted.app) ve uygulamanızla kullandığınız veya kullanmayı planladığınız tüm özel alanları eklemeniz gerekir.

  7. Next step'i (Sonraki adım) tıklayın.

  8. Meydan okumaları kullanacak mısınız? seçeneğini işaretlemeyin.

  9. Anahtar oluştur'u tıklayın.

  10. Anahtar kimliğinizi kopyalayıp kaydedin ve App Check yapılandırma bölümüne geçin.

2. adım: App Check uygulamasını yapılandırın

  1. Firebase konsolunu açın ve gezinme menüsünden Derleme > Uygulama Kontrolü'nü tıklayın.

  2. Başlayın'ı, ardından uygulamanızın yanındaki Kaydol'u tıklayın.

  3. ReCAPTCHA'yı tıklayarak genişletin ve reCAPTCHA Enterprise için oluşturduğunuz anahtar kimliğini yapıştırın.

  4. Kaydet'i tıklayın.

3. adım: Kodunuza App Check ekleyin

  1. Firebase Studio sayfasına dönün ve Code görünümünde, oluşturduğunuz site anahtarını .env dosyanıza ekleyin:

    NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY
    
  2. Firebase yapılandırmanız .env konumuna kaydedilmediyse alın:

    • Firebase konsolundan Proje ayarları'nı açın ve uygulamanıza karşılık gelen bölümde bulun.

    • Code görünümündeki Terminal'den:

      1. Firebase'e giriş yapın: firebase auth login
      2. Projenizi seçin: firebase use FIREBASE_PROJECT_ID
      3. Firebase yapılandırmasını alın: firebase apps:sdkconfig
  3. Yapılandırmayı .env dosyanıza ekleyin. Dosyanız aşağıdaki gibi görünmelidir:

    NEXT_PUBLIC_FIREBASE_API_KEY=FIREBASE_API_KEY
    NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=FIREBASE_AUTH_DOMAIN
    NEXT_PUBLIC_FIREBASE_PROJECT_ID=FIREBASE_PROJECT_ID
    NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=FIREBASE_STORAGE_BUCKET
    NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=FIREBASE_MESSAGING_SENDER_ID
    NEXT_PUBLIC_FIREBASE_APP_ID=FIREBASE_APP_ID
    NEXT_PUBLIC_RECAPTCHA_SITE_KEY=RECAPTCHA_SITE_KEY
    
  4. Uygulama kodunuza App Check ekleyin. Gemini'dan uygulamanıza reCAPTCHA Enterprise ile App Check eklemesini isteyebilir ("reCAPTCHA Enterprise"ı belirttiğinizden ve bunu tekrar kontrol ettiğinizden emin olun) veya App Check'i ilk kullanıma hazırlama bölümündeki adımları uygulayabilirsiniz.

  5. Sitenizi App Hosting adresinde yeniden yayınlayın. Veritabanı ve kimlik doğrulama özelliklerinizi test ederek veri oluşturmayı deneyin.

  6. Derleme > Uygulama Kontrolü'nü açarak App Check uygulamasının Firebase konsolunda istek aldığını doğrulayın.

  7. Cloud Firestore öğesini incelemek için tıklayın. İsteklerin ulaştığını doğruladıktan sonra App Check politikasını uygulamak için Uygula'yı tıklayın.

  8. Firebase Authentication için doğrulama ve yaptırımı tekrarlayın.

Uygulamanızı App Check için kaydettikten sonra, uygulamanızı normalde App Check tarafından geçerli olarak sınıflandırılmayacak bir ortamda (ör. geliştirme sırasında yerel olarak veya sürekli entegrasyon (CI) ortamından) çalıştırmak isterseniz uygulamanızın gerçek bir onay sağlayıcı yerine App Check hata ayıklama sağlayıcısını kullanan bir hata ayıklama derlemesini oluşturabilirsiniz. Web uygulamalarında hata ayıklama sağlayıcısı ile App Check kullanma başlıklı makaleden daha fazla bilgi edinebilirsiniz.

Sonraki adımlar