Firebase Extensions ile web uygulamanıza hızlı bir şekilde yeni işlevler ekleyin

1. Giriş

Hedefler

Bu codelab'de, Firebase Extensions'in yardımıyla bir online pazar yeri uygulamasına işlevsellik ekleyeceksiniz. Bu kod laboratuvarını tamamladığınızda, uzantıların uygulama geliştirme ve yönetim görevlerine daha az zaman ayırmanıza nasıl yardımcı olabileceğini anlayacaksınız.

Oluşturacağınız uygulama

Bu codelab'de, bir online pazar yeri web uygulamasına aşağıdaki özellikleri ekleyeceksiniz:

• Kullanıcıları elde tutma oranını artırmak için resimleri daha hızlı yükleme
• Performansı artırmak ve faturanızı düşürmek için veritabanınızdaki girişleri sınırlama
• Kullanıcı verilerinin korunmasını artırmak için eski kullanıcı verilerinin otomatik olarak silinmesini uygulama

Neler öğreneceksiniz?

• Yaygın kullanım alanları için uzantıları keşfetme
• Projenize uzantı yükleme ve yapılandırma
• Projenizdeki uzantıları koruma (izleme, güncelleme ve kaldırma)

Bu codelab, Firebase uzantılarına odaklanmaktadır. Bu kod laboratuvarının bahsetmiş olduğu diğer Firebase ürünleri hakkında ayrıntılı bilgi için Firebase dokümanlarına ve diğer kod laboratuvarlarına göz atın.

Gerekenler

• Modern bir web tarayıcısının yüklü olduğu bir bilgisayar (Chrome önerilir)
• Google Hesabı

2. Firebase projesi oluşturup ayarlama

Firebase projesi oluşturma

1. Firebase konsolunda Proje ekle'yi tıklayın ve Firebase projesini FriendlyMarket olarak adlandırın.
2. Proje oluşturma seçeneklerini tıklayın. Firebase şartlarını kabul edin. Bu uygulamada Analytics'i kullanmayacağınız için Google Analytics'i ayarlamayı atlayın.
3. Projenin temel hazırlığının yapılmasını bekleyin ve ardından Devam'ı tıklayın.

Oluşturacağınız uygulamada, web uygulamaları için kullanılabilen birkaç Firebase ürünü kullanılır:

• Kullanıcılarınızı kolayca tanımlamak için Firebase Authentication
• Yapılandırılmış verileri bulutta depolamak ve veriler güncellendiğinde anında bildirim almak için Firebase Realtime Database
• Görüntüleri buluta kaydetmek için Cloud Storage for Firebase

Artık Firebase konsolunu kullanarak bu Firebase ürünlerini etkinleştirip yapılandıracaksınız.

Firebase fiyatlandırma planınızı yükseltme

Firebase Extensions'i ve temel bulut hizmetlerini, ayrıca Firebase için Cloud Storage'ı kullanmak istiyorsanız Firebase projenizin kullandıkça öde (Blaze) fiyatlandırma planında olması gerekir. Yani projeniz bir Cloud Faturalandırma hesabına bağlı olmalıdır.

• Cloud Billing hesabı için kredi kartı gibi bir ödeme yöntemi gerekir.
• Firebase ve Google Cloud'da yeniyseniz 300 ABD doları kredi ve Ücretsiz Deneme Cloud Faturalandırma hesabı almaya uygun olup olmadığınızı kontrol edin.
• Bu kod laboratuvarını bir etkinlik kapsamında yapıyorsanız düzenleyen kişiye Cloud kredisi olup olmadığını sorun.

Projenizi Blaze planına yükseltmek için aşağıdaki adımları uygulayın:

1. Firebase konsolunda planınızı yükseltmeyi seçin.
2. Blaze planını seçin. Projenize bir Cloud Faturalandırma hesabı bağlamak için ekrandaki talimatları uygulayın.
   Bu yükseltme kapsamında bir Cloud Faturalandırma hesabı oluşturmanız gerekiyorsa yükseltmeyi tamamlamak için Firebase Console'daki yükseltme akışına geri dönmeniz gerekebilir.

E-posta ile girişi etkinleştirme

Bu codelab'in odak noktası kimlik doğrulama olmasa da uygulamanızı kullanan herkesi benzersiz şekilde tanımlamak için uygulamanızda bir tür kimlik doğrulama yöntemi kullanmanız önemlidir. E-posta ile giriş yaparsınız.

1. Firebase konsolunda, sol panelde Geliştir'i tıklayın.
2. Kimlik doğrulama'yı ve ardından Oturum açma yöntemi sekmesini tıklayın (veya doğrudan Oturum açma yöntemi sekmesine gitmek için burayı tıklayın).
3. Oturum açma sağlayıcıları listesinde E-posta/Şifre'yi tıklayın, Etkinleştir anahtarını açık konuma getirin ve ardından Kaydet'i tıklayın.

Realtime Database'i etkinleştirme

Uygulama, satılık öğeleri kaydetmek için Firebase Realtime Database'i kullanır.

1. Firebase konsolunun sol panelinde Derleme'yi genişletin ve ardından Anlık Veritabanı'nı seçin.
2. Create database'i (Veritabanı oluştur) tıklayın.
3. Veritabanı için bir konum seçip Sonraki'yi tıklayın.
   Gerçek bir uygulama için kullanıcılarınıza yakın bir konum seçmeniz gerekir.
4. Test modunda başlat'ı tıklayın. Güvenlik kurallarıyla ilgili sorumluluk reddi beyanını okuyun.
   Bu kod laboratuvarının sonraki adımlarında, verilerinizin güvenliğini sağlamak için güvenlik kuralları ekleyeceksiniz. Veritabanınıza Güvenlik Kuralları eklemeden bir uygulamayı dağıtmayın veya herkese açık olarak göstermeyin.
5. Oluştur'u tıklayın.

Veritabanı için güvenlik kuralları belirleme

Artık bu uygulama için gereken güvenlik kurallarını ayarlayacaksınız. Bunlar, uygulamanızın güvenliğini sağlamaya yardımcı olacak bazı temel örnek kurallardır. Bu kurallar, satıştaki öğelerin herkes tarafından görüntülenmesine izin verir ancak diğer okuma ve yazma işlemlerinin yalnızca oturum açmış kullanıcılar tarafından yapılmasına izin verir. Bu kuralların ayrıntıları hakkında endişelenmeyin. Uygulamanızı kullanıma sunmak için bu kuralları kopyalayıp yapıştırmanız yeterlidir.

1. Gerçek Zamanlı Veritabanı kontrol panelinin üst kısmında Kurallar sekmesini tıklayın.

2. Aşağıdaki kural grubunu kopyalayıp Kurallar sekmesindeki kurallar alanına yapıştırın:

   {
     "rules": {
       ".read": false,
       ".write": false,
         "drafts": {
           ".indexOn": "seller",
           ".read": "auth.uid !== null",
           ".write": "auth.uid !== null"
       },
       "sellers": {
           ".read": "auth.uid !== null",
           ".write": "auth.uid !== null"
       },
         "forsale": {
           ".read": true,
           ".write": "auth.uid !== null"
         }
     }
   }
   

3. Yayınla'yı tıklayın.

Cloud Storage for Firebase'ı ayarlama

Uygulama, satılık öğelerin resimlerini kaydetmek için Firebase için Cloud Storage'ı kullanır.

Firebase projenizde Cloud Storage for Firebase'i ayarlamak için:

1. Firebase konsolunun sol panelinde Derleme'yi genişletin ve ardından Depolama'yı seçin.
2. Başlayın'ı tıklayın.
3. Varsayılan Storage paketiniz için bir konum seçin.
   US-WEST1, US-CENTRAL1 ve US-EAST1'deki paketler, Google Cloud Storage'ın "Daima Ücretsiz" katmanından yararlanabilir. Diğer tüm konumlardaki paketler için Google Cloud Storage fiyatlandırması ve kullanımı geçerlidir.
4. Test modunda başlat'ı tıklayın. Güvenlik kurallarıyla ilgili sorumluluk reddi beyanını okuyun.
   Bu kod laboratuvarının sonraki adımlarında, verilerinizin güvenliğini sağlamak için güvenlik kuralları ekleyeceksiniz. Depolama alanı paketiniz için Güvenlik Kuralları eklemedenbir uygulamayı dağıtmayın veya herkese açık olarak göstermeyin.
5. Oluştur'u tıklayın.

Depolama alanı paketiniz için güvenlik kuralları ayarlama

Artık bu uygulama için gereken güvenlik kurallarını ayarlayacaksınız. Bu kurallar yalnızca kimliği doğrulanmış kullanıcıların yeni resim yayınlamasına izin verir ancak listelenen bir öğenin resmini herkesin görüntülemesine olanak tanır.

1. Depolama alanı kontrol panelinin üst kısmında Kurallar sekmesini tıklayın.

2. Aşağıdaki kural grubunu kopyalayıp Kurallar sekmesindeki kurallar alanına yapıştırın:

   rules_version = '2';
   service firebase.storage {
     match /b/{bucket}/o {
   
       match /{allPaths=**} {
         allow read, write: if request.auth != null;
       }
   
       match /friendlymarket/{ImageId} {
         allow read;
         allow write: if request.auth != null;
       }
   
     }
   }
   

3. Yayınla'yı tıklayın.

3. Örnek uygulamayı çalıştırma

StackBlitz projesini çatallama

Bu codelab'de, çeşitli Firebase iş akışlarının entegre edildiği online bir düzenleyici olan StackBlitz'i kullanarak bir uygulama oluşturup dağıtacaksınız. Stackblitz için yazılım yüklemeniz veya özel bir StackBlitz hesabınız olması gerekmez.

StackBlitz, projeleri başkalarıyla paylaşmanıza olanak tanır. StackBlitz proje URL'niz olan diğer kullanıcılar kodunuzu görebilir ve projenizi çatallayabilir ancak StackBlitz projenizi düzenleyemez.

1. Başlangıç kodu için şu URL'ye gidin: https://stackblitz.com/edit/friendlymarket-codelab.
2. StackBlitz sayfasının üst kısmında Çatal'ı tıklayın.

Artık başlangıç kodunun bir kopyasını kendi StackBlitz projeniz olarak kullanabilirsiniz. Oturum açmadığınız için "hesabınızın" adı @anonymous. Bu sorun değil. Projenin benzersiz bir adı ve URL'si olmalıdır. Tüm dosyalarınız ve değişiklikleriniz bu StackBlitz projesine kaydedilir.

Projeye Firebase web uygulaması ekleme

1. StackBlitz'te src/firebase-config.js dosyanızı görüntüleyin. Firebase yapılandırma nesnesini buraya eklersiniz.
2. Firebase Konsolu'nda, sol üstteki Projeye Genel Bakış'ı tıklayarak projenizin genel bakış sayfasına gidin.
3. Yeni bir Firebase web uygulaması oluşturmak için projenizin genel bakış sayfasının ortasındaki web simgesini tıklayın.
4. Uygulamayı FriendlyMarket Codelab takma adıyla kaydedin.
5. Bu codelab için Bu uygulama için Firebase Hosting'i de ayarlayın seçeneğinin yanındaki kutuyu işaretlemeyin. Bunun yerine StackBlitz önizleme bölmesini kullanacaksınız.
6. Uygulamayı kaydet'i tıklayın.
7. Uygulamanızın Firebase yapılandırma nesnesini panonuza kopyalayın. <script> etiketlerini kopyalamayın. Not: Yapılandırmayı daha sonra bulmanız gerekirse buradaki talimatları uygulayın.

8. Konsol'a devam et'i tıklayın.

Projenizin yapılandırmasını uygulamanıza ekleyin:

1. StackBlitz'te src/firebase-config.js dosyasına gidin.
2. Yapılandırma snippet'inizi dosyaya yapıştırın. Bunu yaptıktan sonra yapılandırma şu şekilde görünecektir (ancak yapılandırma nesnesinde kendi projenizin değerleri yer alır):

Bu uygulamanın başlangıç noktası nedir?

StackBlitz ekranının sağ tarafındaki etkileşimli önizlemeye göz atın:

Bu kod laboratuvarının başlangıcında temel bir pazar yeri uygulamasının kodu yer alır. Tüm kullanıcılar, satılık öğelerin listesini görüntüleyebilir ve bir öğenin ayrıntılar sayfasını görüntülemek için bağlantıyı tıklayabilir. Oturum açmış kullanıcılar, fiyat üzerinden pazarlık edip ürünü satın alabilmek için satıcının iletişim bilgilerini görür.

Uygulamayı deneyin:

1. Ana ekranın üst kısmındaki düğmeyi kullanarak oturum açın. Sahte bir e-posta adresi, ad ve şifre kullanabilirsiniz.
2. Giriş oluşturmak için sağ alt köşedeki Bir ürün sat düğmesini tıklayın.
3. Başlık için Xylophonegirin.
4. İstenen Fiyat alanına 50girin.
5. Öğe Açıklaması alanına şunları girin: This high quality xylophone can be used to play music.
6. Bu ksilofon resmini bilgisayarınıza indirip ÖĞENİNİZİN RESMİ düğmesiyle yükleyin.

file_downloadResmi İndir

7. Tüm alanları doldurup bir resim yükledikten sonra Yayınla'yı tıklayın.
8. Yeni girişinizi bulun. Ürününüzün ayrıntılar ekranını görmek için ürünü tıklayın ve ardından Satıcı iletişim bilgileri panelini genişletin.
9. Firebase konsoluna geri dönün. Veritabanı kontrol panelinde, yayınladığınız öğe için forsale düğümünün altında bir giriş görürsünüz. Depolama kontrol panelinde, yüklediğiniz resmi friendlymarket yolunda da bulabilirsiniz.

4. Uzantı bulma ve yükleme

Sorun

Uygulamanız için biraz kullanıcı araştırması yaptıktan sonra, kullanıcıların çoğunun sitenizi masaüstünden değil, akıllı telefonlarından ziyaret ettiğini fark ediyorsunuz. Ancak istatistikleriniz, mobil kullanıcıların sitenizden yalnızca birkaç saniye sonra ayrılma eğiliminde olduğunu da gösteriyor.

Merak ederek sitenizi mobil bağlantı hızlarıyla test edersiniz. (Bunun nasıl yapılacağını buradan öğrenebilirsiniz.) Resimlerin yüklenmesi çok uzun sürüyor ve tarayıcıda hiç önbelleğe alınmıyor. Bu uzun yükleme süresi her sayfa görüntülemesinde yaşanır.

Çözüm

Resimlerin nasıl optimize edileceği hakkında bilgi edindikten sonra resim yükleme performansını artırmak için iki adım atmaya karar veriyorsunuz:

• Resimleri sıkıştırın. Mobil telefonlar bile bu uygulamanın ihtiyaçları için gerekenden çok daha yüksek çözünürlükte resimler çekiyor. Dosya boyutunu küçültmek, uygulamadaki çözünürlükte belirgin bir düşüş olmadan yükleme sürelerini hızlandırır.
• Önbelleğe alma. Cloud Storage nesneleri varsayılan olarak tarayıcılara resimleri önbelleğe almamalarını söyleyen üstbilgilere sahiptir. Bu da kullanıcının tarayıcısının aynı resmi tekrar tekrar indireceği anlamına gelir. Neyse ki bu üstbilgileri, önbelleğe almaya izin verecek şekilde değiştirebilirsiniz. Hem istemci tarafı Cloud Storage SDK'sı hem de Firebase Yönetici SDK'sı bu üstbilgileri ayarlamanıza olanak tanır.

Resimleri sıkıştırmak için yükleme kalitesini sınırlamanız veya resimleri yeniden boyutlandıran sunucu tarafı bir işleme sahip olmanız gerekir. Bu işlemin artılarını ve eksilerini değerlendirelim:

• İstemci tarafı. İstemci tarafı işlem için, yüklenen resimlerin dosya boyutunu sınırlayabilirsiniz. Bu nedenle, yeni sunucu mantığı yazmanız veya mevcut sunucu mantığını yönetmeniz gerekmez. Ancak bu, satıcılarınızın kendi resimlerini nasıl yeniden boyutlandıracaklarını öğrenmeleri gerektiği anlamına da gelir. Bu da yeni bir giriş oluşturmanın önündeki can sıkıcı ve sezgisel olmayan bir engeldir.
• Sunucu tarafı. Cloud Functions for Firebase kullanıyorsanız yükleme sırasında bir resmi otomatik olarak yeniden boyutlandıran bir işlevi tetikleyebilirsiniz. Bu sayede satıcılar istedikleri boyuttaki resmi yükleyebilir (ek işlem yapmaları gerekmez) ve arka uç işleviniz resmi sorunsuz bir şekilde yeniden boyutlandırabilir. Bu işlev için bir örnek bile mevcuttur.

Sunucu tarafının tercih edilmesi gerektiği anlaşılıyor. Ancak bu fikirde yine de örneği klonlamak, kurulum talimatlarını uygulamak ve ardından işlevi Firebase CLI ile dağıtmak gerekiyor. Resim boyutlandırma, yaygın bir kullanım alanı gibi görünüyor. Daha kolay bir çözüm yok mu?

Daha kolay bir çözüm

Şanslısınız. Daha kolay bir çözüm var: Firebase Extensions. Firebase web sitesinde mevcut uzantıların kataloğunu kontrol edelim.

Şuna bak! "Resimleri yeniden boyutlandır" adlı bir uzantı var. Bu umutlu bir gelişme.

Bu uzantıyı uygulamanızda kullanalım.

Uzantıları yükleme

1. Bu uzantı hakkında daha fazla bilgi görüntülemek için Ayrıntıları göster'i tıklayın. Yapılandırabileceğiniz ayarlar bölümünde, uzantı, yeniden boyutlandırmak istediğiniz boyutları ayarlamanıza olanak tanır. Hatta önbellek başlığını da ayarlayabilirsiniz. Mükemmel!
2. Uzantının ayrıntılar sayfasında Konsolda yükle düğmesini tıklayın. Tüm projelerinizin listelendiği bir Firebase konsol sayfasına yönlendirilirsiniz.
3. Bu kod laboratuvarı için oluşturduğunuz FriendlyMarket projesini seçin.
4. Uzantıyı yapılandır adımına ulaşana kadar ekrandaki talimatları uygulayın. Talimatlarda, uzantının temel bir özeti ve oluşturacağı tüm kaynaklar ile ihtiyaç duyduğu erişim rolleri gösterilir.
5. **Cache-Control**yeniden boyutlandırılmış resimler için üstbilgi alanına aşağıdakileri girin:

public, max-age=31536000

6. Diğer parametreleri varsayılan değerlerinde bırakın.
7. Uzantıyı yükle'yi tıklayın.

Yüklemenin tamamlanmasını beklerken...

Firebase komut satırı arayüzüyle yükleme

Komut satırı araçlarını kullanma konusunda daha rahatsanız uzantıları Firebase CLI ile de yükleyebilir ve yönetebilirsiniz. CLI'nin en son sürümünde bulunan firebase ext komutunu kullanmanız yeterlidir. Daha fazla bilgiye buradan ulaşabilirsiniz.

(İsteğe bağlı) Cache-Control başlıkları hakkında daha fazla bilgi edinin.

Cache-Control başlığı değeri public, max-age=31536000, resmin 1 yıla kadar önbelleğe alınacağı anlamına gelir. Cache-Control başlığı hakkında daha fazla bilgi edinmek için bu dokümana göz atın.

İstemci kodunu güncelleme

Yüklediğiniz uzantı, yeniden boyutlandırılmış bir resmi orijinal resimle aynı pakete yazar. Yeniden boyutlandırılan resmin dosya adına yapılandırılmış boyutlar eklenir. Dolayısıyla, orijinal dosya yolu friendlymarket/user1234-car.png gibi görünüyorsa yeniden boyutlandırılmış resmin dosya yolu friendlymarket/user1234-car_200x200.png gibi görünür.

Uygulamayı, tam boyutlu resimler yerine yeniden boyutlandırılmış resimleri getirecek şekilde güncelleyelim.

1. StackBlitz'te src/firebase-refs.js dosyasını açın.
2. Yeniden boyutlandırılmış resmin referansını oluşturmak için mevcut getImageRef işlevini aşağıdaki kodla değiştirin:

export function getImageRef(storage, imagePath) {
  const xDimension = 200;
  const yDimension = 200;

  // find the '.' in 'file.jpg', 'file.png', etc
  const fileExtensionIndex = imagePath.lastIndexOf('.');

  const pathNameWithoutExtension = imagePath.substring(0, fileExtensionIndex);
  const dimensions = `${xDimension}x${yDimension}`;
  const fileExtension = imagePath.substring(fileExtensionIndex);

  return {
    resized: storage().ref(
      `${pathNameWithoutExtension}_${dimensions}${fileExtension}`
    ),
    original: storage().ref(imagePath)
  };
}

Test edin

Bu uzantı yeni resim yüklemelerini izlediği için mevcut resminiz yeniden boyutlandırılmaz.

Uzantıların nasıl çalıştığını görmek için yeni bir yayın oluşturun:

1. Ana ekrana gitmek için uygulamanızın üst çubuğunda Friendly Market'i tıklayın.
2. Giriş oluşturmak için uygulamanın sağ alt köşesindeki Bir şey sat düğmesini tıklayın.
3. Başlık için Coffee girin.
4. İstenen Fiyat alanına 1 girin.
5. Öğe Açıklaması alanına Selling one cafe latte. It has foam art in the shape of a beargirin.
6. Bu fincan kahve resmini bilgisayarınıza indirin ve ÜRÜNÜNÜZÜN RESMİ düğmesiyle yükleyin. file_downloadResmi İndir
7. Tüm alanları doldurup bir resim yükledikten sonra Yayınla'yı tıklayın. Kahve girişini xilofonun altında görürsünüz.
8. Firebase konsolundaki Functions kontrol panelinde Günlükler sekmesini tıklayın. İşlevin yürütüldüğünü gösteren günlükleri görürsünüz.

9. Hem orijinal kahve resmini hem de friendlymarket yolundaki yeniden boyutlandırılmış bir sürümü görmek için Depolama kontrol paneline gidin.
10. StackBlitz önizleme bölmesinde, uygulamanızın ana ekranını birkaç kez yeniden yükleyin. Kahve resminin, ksilofon resminden çok daha hızlı yüklendiğini fark edeceksiniz.

Resim, daha küçük olduğu için ilk sayfa yüklemesinde daha hızlı yüklenir ve sonraki sayfa yenilemelerinde ağ isteği tetiklemek yerine tarayıcı önbelleğinden yüklenir.

5. Uzantıları yeniden yapılandırma

Sorun

Uygulamanız, satıcının listelemesinin taslak sürümlerini otomatik olarak kaydeder. Kullanıcılarınız bu özelliği beğeniyor ancak istatistikleriniz biraz endişe verici. Raporlarınız, taslakların yalnızca yaklaşık% 10'unun yayınlandığını, diğer% 90'ının ise veritabanınızda yer kapladığını gösteriyor.

Çözüm

Basit bir hesaplama yaptıktan sonra, herhangi bir zamanda yalnızca yaklaşık beş taslak kaydetmeniz gerektiğini fark edersiniz.

Firebase Extensions kataloğunu hatırlıyor musunuz? Bu durum için önceden oluşturulmuş bir çözüm olabilir. Kayıtlı taslakların sayısını otomatik olarak beş veya daha az tutacak Alt Düğümleri Sınırla uzantısını yükleyelim. Uzantı, yeni bir taslak eklendiğinde en eski taslağı siler.

1. Uzantının ayrıntılar sayfasında Yükle düğmesini tıklayın.
2. Pazar yeri web uygulamanız için kullandığınız Firebase projesini seçin.
3. Uzantıyı yapılandır adımına ulaşana kadar ekrandaki talimatları uygulayın.
4. Realtime Database yolu için drafts girin. Bu, taslakların veritabanında kaydedildiği yoldur.
5. Saklanacak maksimum düğüm sayısı için 5 değerini girin. Bu, her öğenin girişi için beş taslak kaydedileceği ve başka bir taslak eklenirse en eski taslağın otomatik olarak silineceği anlamına gelir.
6. Uzantıyı yükle'yi tıklayın.

Yüklemenin tamamlanmasını beklerken...

Uzantı izleme

Uzantı yüklediğinizde bu işlem birkaç işlev oluşturur. Bu işlevlerin ne sıklıkta çalıştığını kontrol edebilir veya günlükleri ve hata oranlarını görüntüleyebilirsiniz. Uzantınızın nasıl izleneceğiyle ilgili ayrıntılı bilgi için Yüklü uzantıları yönetme başlıklı makaleyi inceleyin. Önceki adımda Resimleri Yeniden Boyutlandır uzantısı tarafından oluşturulan işlevleri görüntülemek için dokümanlar bölümündeki talimatları uygulayın.

Uzantıları kaldırma

Bir uzantıyı projenizden kaldırmak için uzantının oluşturduğu işlevleri tek tek silmek isteyebilirsiniz. Ancak bir uzantı birden fazla işlev oluşturabileceğinden bu işlem beklenmedik davranışlara neden olabilir. Uzantıların nasıl kaldırılacağını dokümanlar bölümünden öğrenebilirsiniz.

Yükleme kaldırıldığında tüm kaynaklar (uzantının işlevleri gibi) ve uzantının bu örneği için oluşturulan hizmet hesabı silinir. Ancak uzantı tarafından oluşturulan yapılar (ör. yeniden boyutlandırılmış resimler), uzantı kaldırıldıktan sonra projenizde kalır.

Bir uzantının birden çok kopyasını tek bir projeye yükleme

Bir projeye belirli bir uzantının tek bir örneğini yüklemekle sınırlı değilsiniz. Başka bir yoldaki girişleri sınırlamak istiyorsanız bu uzantının başka bir örneğini yükleyebilirsiniz. Ancak bu codelab için uzantıyı yalnızca bir kez yükleyeceğiz.

Uygulama şeklini görün

1. Zil veya latte yayınlamak için kullandığınız hesapla giriş yaptığınızdan emin olun.
2. Birkaç taslak oluşturun:
3. Uygulamanın sağ alt köşesindeki Bir şey sat düğmesini tıklayın.
4. Başlığı "Taslak 1" olarak düzenleyin.
5. Taslaklar bölümüne gidip taslakların sayısını görüntüleyin. En az iki tane olmalıdır.
6. Üst uygulama çubuğundaki FRIENDLY MARKET (UYGUN PAZAR) düğmesini tıklayın. Böylece, kaydedilmiş bir taslanız olur ancak bunu yayınlamanız gerekmez.
7. "2. Taslak", "3. Taslak" ve "6. Taslak" için de aynı işlemi tekrarlayın.
8. "Taslak 6"ı oluşturduğunuzda "Taslak 1"in Taslaklar bölümünüzden kaybolduğunu fark edersiniz.
9. Resimleri Yeniden Boyutlandır uzantısında yaptığınız gibi, hangi işlevlerin tetiklendiğini görmek için işlev günlüklerini kontrol edebilirsiniz.

Yanlışlıkla, saklanacak taslak sayısı sınırı çok küçük

Müşteri destek ekibiniz size ulaşarak en üretken satıcılarınızdan bazılarının, taslaklarının yayınlanmadan önce silindiğinden şikayet ettiğini bildirir. Ekip arkadaşınızın yardımıyla hesaplamalarınızı kontrol ettiğinizde, 10.000 kat hata yaptığınız fark edersiniz.

Bu sorunu nasıl düzeltebilirsiniz? Yüklü uzantıyı yeniden yapılandıralım.

1. Firebase konsolunun sol bölmesinde Uzantılar'ı tıklayın.
2. Yüklü uzantının kartında Yönet'i tıklayın.
3. Sağ üst köşede Uzantıyı yeniden yapılandır'ı tıklayın.
4. Saklanacak maksimum düğüm sayısı'nı 50000 olarak değiştirin.
5. Kaydet'i tıklayın.

Hepsi bu kadar. Uzatma güncellenirken destek ekibinizle iletişime geçerek bir çözümün kullanıma sunulmakta olduğunu bildirebilirsiniz.

6. Kullanıcı verilerini otomatik olarak silme

Sorun

Müşteri destek ekibiniz sizinle tekrar iletişime geçti. Hesaplarını silen satıcılar, diğer kullanıcılardan hâlâ e-posta alıyor ve bu durum onları kızdırıyor. Bu satıcılar, hesaplarını sildiklerinde e-posta adreslerinin sistemlerinizden silinmesini bekliyordu.

Destek ekibi şu anda her kullanıcının verilerini manuel olarak siliyor ancak daha iyi bir yöntem olmalı. Bu konuyu düşünüp düzenli olarak çalışan ve silinen hesaplardaki e-posta adreslerini temizleyen kendi toplu işinizi yazmaya karar veriyorsunuz. Ancak kullanıcı verilerinin silinmesi oldukça yaygın bir sorun gibi görünüyor. Firebase Extensions bu sorunu çözmenize de yardımcı olabilir.

Çözüm

Kullanıcı Verilerini Sil uzantısını, kullanıcı hesabı silindiğinde veritabanındaki users/uid düğümünü otomatik olarak silecek şekilde yapılandıracaksınız.

1. Uzantının ayrıntılar sayfasında Yükle düğmesini tıklayın.
2. Pazar yeri web uygulamanız için kullandığınız Firebase projesini seçin.
3. Uzantıyı yapılandır adımına ulaşana kadar ekrandaki talimatları uygulayın.
4. Realtime Database yolları için sellers/{UID} yazın. sellers kısmı, alt öğeleri kullanıcı e-posta adreslerini içeren düğümdür ve {UID} bir joker karakterdir. Bu yapılandırmayla uzantı, 1234 kimlikli kullanıcı hesabını sildiğinde sellers/1234 öğesini veritabanından sileceğini bilir.
5. Uzantıyı yükle'yi tıklayın.

Yüklemenin tamamlanmasını beklerken...

Özelleştirilebilirlik hakkında konuşalım

Bu codelab'de, Firebase Extensions'ın yaygın kullanım alanlarını çözmeye yardımcı olabileceğini ve uzantıların uygulamanızın ihtiyaçlarına uyacak şekilde yapılandırılabilir olduğunu gördünüz.

Ancak uzantılar her sorunu çözemez. Kullanıcı verilerinin silinmesi sorunu buna iyi bir örnektir. Kullanıcı Verilerini Sil uzantısı, kullanıcılar hesaplarını sildikten sonra e-postalarının hâlâ gösterildiğine dair mevcut şikayeti giderse de uzantı her şeyi silmez. Örneğin, öğe girişi hâlâ kullanılabilir durumda kalır ve Cloud Storage'daki tüm resimler de kaldırılmaz. Kullanıcı Verilerini Sil uzantısı, silinecek bir Cloud Storage yolunu yapılandırmamıza olanak tanır ancak kullanıcılar çok sayıda farklı ada sahip çok sayıda farklı dosya yükleyebildiğinden bu uzantıyı, bu yapıları otomatik olarak silecek şekilde yapılandıramazsınız. Bu gibi durumlarda, uygulamanızın veri modeline özel kod yazabilmeniz için Firebase için Cloud Functions daha uygun olabilir.

Uzantılar ve faturalandırma

Firebase uzantılarının kullanımı ücretsizdir (yalnızca kullandığınız temel kaynaklar için ücretlendirilirsiniz). Ancak bir uzantının ihtiyaç duyduğu temel kaynaklardan bazıları için faturalandırma gerekebilir. Bu kod laboratuvarı, faturalandırma hesabı olmadan tamamlanacak şekilde tasarlanmıştır. Ancak Flame veya Blaze planı oluşturmak, birçok ilginç Firebase uzantısının kilidini açar.

Örneğin, URL'leri kısaltabilir, e-posta tetikleyebilir, koleksiyonları BigQuery'ye aktarabilir ve daha fazlasını yapabilirsiniz. Uzantıların tam kataloğunu burada bulabilirsiniz.

Şu anda kullanılamayan ancak kullanmak istediğiniz bir uzantı varsa lütfen bize bildirin. Yeni bir uzantı önermek için Firebase Destek Ekibi'ne özellik isteği gönderin.

Uygulama şeklini görün

Uzantı yüklemeniz tamamlandıktan sonra bir kullanıcıyı silin ve ne olduğunu görün:

1. Firebase konsolunda Gerçek Zamanlı Veritabanı kontrol panelinize gidin.
2. sellers düğümünü genişletin.
3. Her satıcının bilgileri, kullanıcı kimliklerine göre anahtarlanır. Bir kullanıcının UID'sini seçin.
4. Firebase konsolunda Authentication kontrol panelinize gidin ve söz konusu kullanıcının UID'sini bulun.
5. UID'nin sağındaki menüyü genişletin ve Hesabı Sil'i seçin.

6. Realtime Database kontrol panelinize geri dönün. Satıcının bilgileri silinir.

7. Tebrikler!

Bu codelab'de çok fazla kod yazmamış olsanız da pazar yeri uygulamanıza önemli özellikler eklediniz.

Uzantıları nasıl bulacağınızı, yapılandıracağınızı, yükleyeceğinizi ve yeniden yapılandıracağınızı öğrendiniz. Ayrıca, yüklü uzantıları nasıl izleyeceğinizi ve gerekirse nasıl kaldıracağınızı öğrendiniz.

Sırada ne var?

Diğer uzantılardan bazılarına göz atın:

• Cloud Firestore'da metin dizelerini çevirme (faturalandırma hesabı gereklidir)
• Mailchimp e-posta listelerine yeni kullanıcı ekleme (faturalandırma hesabı gereklidir)
• URL'leri kısaltma (faturalandırma hesabı gereklidir)

Daha fazla özel sunucu tarafı koda mı ihtiyacınız var?

• Cloud Functions for Firebase kod laboratuvarına göz atın

Diğer faydalı dokümanlar

Uzantıları yönetme:

• Uzantıları Firebase CLI ile yönetmeyi deneyin
• Bütçe uyarıları ayarlama
• Yüklü bir uzantının ne sıklıkta çalıştığını kontrol etme
• Yüklü bir uzantıyı yeni bir sürüme güncelleme
• Uzantıların yüklemesini kaldırma

Uzantılarla ilgili ayrıntılı bilgi edinme:

• Her uzantının kaynak kodunu ve belgelerini GitHub'da görüntüleyin.
• Bir uzantıya verilen izinler ve erişim hakkında bilgi edinme