Firebase Web Push Kurulumu (2. Ders)

Google firebase web push sistemi aracılığıyla sitenize web push bildirimleri eklemek için yazımızın detaylarına göz atabilirsiniz.

Firebase Web Push Kurulumu (2. Ders)

Günümüz web sitelerinin çoğunda karşılaştığımız bildirim sistemini bu yazımızda sizlerinde kolay bir şekilde nasıl yapacağınızı anlatacağım. Öncelikle bildirim sistemimizin alt yapısını google firebase oluşturuyor. Google firebase tarafında oluşturacağınız uygulama, jquery ve php&mysql aracılığıyla basit bir şekilde bu sistemi oluşturmanız mümkün. Lafı fazla uzatmadan serimizin ikinci yazısına başlayalım.

Bir önceki yazımızda google firebase sistemi için gerekli olan keylerimizi nasıl edineceğimizi anlatmıştık. Henüz o yazımıza göz atmadıysanız buraya tıklayarak o yazımızı okuyabilirsiniz.

Serimizin ikinci yazısına tekrardan hoşgeldiniz. Bu yazımızın içeriği almış olduğumuz keyler ile google firebase altyapılı bildirim sistemini web sitemize entegre etme aşamaları olacaktır. Entegrasyon aşamasında ilk olarak google firebase sdk kütüphanelerini sitemize ekleyerek başlamamız gerekiyor. Kütüphaneler için web sitemizin </ body> tagından önceki kısmında;

<*script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-app.js">
<*script src="https://www.gstatic.com/firebasejs/7.8.0/firebase-messaging.js">
<*script>
var firebaseConfig = {
  apiKey: "api-key",
  authDomain: "project-id.firebaseapp.com",
  databaseURL: "https://project-id.firebaseio.com",
  projectId: "project-id",
  storageBucket: "project-id.appspot.com",
  messagingSenderId: "sender-id",
  appId: "app-id",
};
<*/script>

Not: * işaretini siliniz.

javascript kodlarını ekleyerek sayfamıza kütüphaneleri dahil ediyoruz. FirebaseConfig kısmında girmemiz gereken değerleri en kolay yöntemle https://console.firebase.google.com/ adresine gidip oluşturduğumuz uygulamayı seçtikten sonra açılan sayfada uygulama isminin altında bulunan  (x Uygulama yazan bölüm) kısma tıklayıp bu bölümde uygulama isminin yanında bulunan ayarlar iconuna tıkladıktan sonra yeni açılacak sayfanın alt kısmında bulunan ve başında firebase sdk snippets yazan bölümde bulabilirsiniz. Yinede açıklarsak;

  • api-key: bir önceki yazımızda elde etmiş olduğumuz key
  • authDomain: uygulamaya_verdiğiniz_ad.firebaseapp.com
  • databaseURL: https://uygulamaya_verdiğiniz_ad.firebaseio.com
  • projectId: Uygulamayı oluştururken vermiş olduğunuz ad
  • storageBucket: uygulamaya_verdiğiniz_ad.appspot.com
  • messagingSenderId: Uygulama kimliği içerisinde bulabilirsiniz. (Örn: 1:17780938712:web:878edf7447aec6582244ad uygulama kimliğinde koyu yazılan kısım)
  • appId: Uygulama kimliğiniz.

Bu ayarlarlamaları yaptıktan sonra sitemizin header kısmına ise;

<link rel="manifest" href="/manifest.json">
Ekleyerek manifest dosyamızı çağırıyoruz. manifest.json dosyamızın içeriği ise şu şekilde olmalıdır;
{
    "gcm_sender_id" : "103953800507"
}
Buraya girmiş olduğumuz gcm_sender_id bildirimler gönderebilmek için girmemiz gereken statik bir değerdir. Manifest dosyamızı bu içerikle oluşturarak web sitemizin ana dizinine yüklüyoruz. Bu aşamaya kadar ilk dersimizde uygulamamızı oluşturduktan sonra bu dersimizde de google firebase sisteminin alt yapısını oluşturmuş olduk. Bundan sonraki derslerimizde sitemize gelen kullanıcılardan bildirimler gönderebilmek için izin işlemleri, izin sonrası bildirim göndereceğimiz tarayıcıların benzersiz token idlerini alarak depolama ve bildirim gönderme işlemlerini anlatacağız. Serimizin bir sonraki dersinde görüşmek dileğiyle.

Tepkiniz ne oldu?

like
1
dislike
1
love
0
funny
0
angry
0
sad
0
wow
0