Web uygulamasına push bildirimleri ekleme

Push mesajları, kullanıcılarınızla yeniden etkileşime geçmenin basit ve etkili bir yolunu sunar. Bu codelab'de web uygulamanıza push bildirimleri eklemeyi öğreneceksiniz.

Neler öğreneceksiniz?

  • Kullanıcıları push mesajlaşma için abone yapma ve abonelikten çıkarma
  • Gelen push mesajlarını işleme
  • Bildirim görüntüleme
  • Bildirim tıklamalarına yanıt verme

Gerekenler

  • Chrome 52 veya sonraki sürümler
  • Web Server for Chrome veya kendi seçtiğiniz web sunucusu
  • Metin düzenleyici
  • HTML, CSS, JavaScript ve Chrome Geliştirme Araçları hakkında temel bilgi
  • Örnek kod (Kurulum bölümüne bakın.)

Örnek kodu indirme

Bu codelab'deki örnek kodu almak için iki seçeneğiniz vardır:

  • Git deposunu klonlayın:
git clone https://github.com/GoogleChrome/push-notifications.git
  • ZIP dosyasını indirin:

Kaynak kodu indirme

Kaynağı ZIP dosyası olarak indirirseniz dosyayı açtığınızda bir kök klasör push-notifications-master elde edersiniz.

Web sunucusunu yükleme ve doğrulama

Kendi web sunucunuzu kullanmakta serbest olsanız da bu codelab, Chrome için Web Sunucusu uygulamasıyla iyi çalışacak şekilde tasarlanmıştır. Bu uygulama henüz yüklü değilse Chrome Web Mağazası'ndan edinebilirsiniz:

Web Server for Chrome'u yükleme

Web Server for Chrome uygulamasını yükledikten sonra yer işaretleri çubuğundaki Uygulamalar kısayolunu tıklayın:

Uygulamalar penceresinde Web Sunucusu simgesini tıklayın:

Ardından, yerel web sunucunuzu yapılandırmanıza olanak tanıyan şu iletişim kutusunu görürsünüz:

Klasör seç düğmesini tıklayın ve indirdiğiniz push-notifications klasöründeki app klasörünü seçin. Bu sayede, iletişim kutusunun Web Sunucusu URL'leri bölümünde gösterilen URL aracılığıyla devam eden çalışmalarınızı yayınlayabilirsiniz.

Seçenekler bölümünde, aşağıdaki resimde gösterildiği gibi index.html'yi otomatik olarak göster seçeneğinin yanındaki kutuyu işaretleyin:

Ardından Web Server: STARTED (Web Sunucusu: BAŞLATILDI) açma/kapatma düğmesini sola, ardından tekrar sağa kaydırarak sunucuyu durdurup yeniden başlatın.

Web tarayıcınızda sitenizi ziyaret etmek için Web Sunucusu URL'sini tıklayın. Aşağıdaki gibi bir sayfa görmeniz gerekir. Ancak sürümünüzde adres olarak 127.0.0.1:8887 gösterilebilir:

00-push-codelab.png

Hizmet çalışanını her zaman güncelleme

Geliştirme sırasında, hizmet çalışanınızın her zaman güncel olduğundan ve en son değişiklikleri içerdiğinden emin olmanız faydalıdır.

Bu özelliği Chrome'da ayarlamak için:

  1. Push Codelab sekmesine gidin.
  2. Geliştirici Araçları'nı açma: Windows ve Linux'ta Ctrl-Üst Karakter-I, macOS'te Cmd-Option-I.
  3. Application (Uygulama) panelini seçin, Service Workers (Servis Çalışanları) sekmesini tıklayın ve Update on Reload (Yeniden Yüklemede Güncelle) onay kutusunu işaretleyin. Bu onay kutusu etkinleştirildiğinde, sayfa her yeniden yüklendiğinde hizmet çalışanı zorunlu olarak güncellenir.

Tamamlanmış kod

app dizininizde sw.js adlı boş bir dosyanın olduğunu fark edeceksiniz. Bu dosya, hizmet çalışanınız olacak. Şimdilik boş kalabilir. Daha sonra kod ekleyeceksiniz.

Öncelikle bu dosyayı hizmet çalışanı olarak kaydetmeniz gerekir.

app/index.html sayfanız yüklenir scripts/main.js. Service worker'ınızı bu JavaScript dosyasında kaydedersiniz.

Aşağıdaki kodu scripts/main.js dosyasına ekleyin:

if ('serviceWorker' in navigator && 'PushManager' in window) {
  console.log('Service Worker and Push are supported');

  navigator.serviceWorker.register('sw.js')
  .then(function(swReg) {
    console.log('Service Worker is registered', swReg);

    swRegistration = swReg;
  })
  .catch(function(error) {
    console.error('Service Worker Error', error);
  });
} else {
  console.warn('Push messaging is not supported');
  pushButton.textContent = 'Push Not Supported';
}

Bu kod, tarayıcınızın servis çalışanlarını ve push mesajlaşmayı destekleyip desteklemediğini kontrol eder. Destekleniyorsa kod, sw.js dosyanızı kaydeder.

Deneyin

Tarayıcıda Push Codelab sekmesini yenileyerek değişikliklerinizi kontrol edin.

Chrome Geliştirici Araçları'ndaki konsolda Service Worker is registered message simgesini bulun. Örneğin:

Uygulama sunucusu anahtarlarını alma

Bu codelab'i kullanmak için uygulama sunucusu anahtarları oluşturmanız gerekir. Bu işlemi yardımcı sitede yapabilirsiniz: web-push-codelab.glitch.me

Burada genel ve özel anahtar çifti oluşturabilirsiniz.

push-codelab-04-companion.png

Ortak anahtarınızı scripts/main.js içine kopyalayın ve <Your Public Key> değerini değiştirin:

const applicationServerPublicKey = '<Your Public Key>';

Önemli: Özel anahtarınızı hiçbir zaman web uygulamanıza yerleştirmemelisiniz.

Tamamlanmış kod

Şu anda web uygulamasının Etkinleştir düğmesi devre dışı ve tıklanamıyor. Bunun nedeni, push mesajlaşmanın tarayıcı tarafından desteklendiğini öğrendikten ve kullanıcının şu anda mesajlaşmaya abone olup olmadığını kontrol edebildikten sonra push düğmesini varsayılan olarak devre dışı bırakmanın ve etkinleştirmenin iyi bir uygulama olmasıdır.

scripts/main.js içinde iki işlev oluşturmanız gerekir:

  • initializeUI, kullanıcının şu anda abone olup olmadığını kontrol etmek için
  • updateBtn: Düğmenizi etkinleştirmek ve kullanıcının abone olup olmamasına bağlı olarak metni değiştirmek için

initializeUI işlevini main.js gibi bir formüle ekleyin:

function initializeUI() {
  // Set the initial subscription value
  swRegistration.pushManager.getSubscription()
  .then(function(subscription) {
    isSubscribed = !(subscription === null);

    if (isSubscribed) {
      console.log('User IS subscribed.');
    } else {
      console.log('User is NOT subscribed.');
    }

    updateBtn();
  });
}

Yeni yönteminiz, önceki adımdaki swRegistration değerini kullanır, bu değerden pushManager özelliğini alır ve bu özellik üzerinde getSubscription() işlevini çağırır.

pushManager. getSubscription(), varsa mevcut abonelikle çözümlenen bir söz döndürür. Aksi takdirde null değeri döndürülür. Böylece, kullanıcının zaten abone olup olmadığını kontrol edebilir, isSubscribed değerini ayarlayabilir ve ardından düğmeyi güncellemek için updateBtn() işlevini çağırabilirsiniz.

updateBtn() işlevini main.js'e ekleyin:

function updateBtn() {
  if (isSubscribed) {
    pushButton.textContent = 'Disable Push Messaging';
  } else {
    pushButton.textContent = 'Enable Push Messaging';
  }

  pushButton.disabled = false;
}

Bu işlev, kullanıcı abone olup olmadığına bağlı olarak düğmeyi etkinleştirir ve düğme metnini değiştirir.

Yapılacak son işlem, hizmet çalışanınız main.js içinde kaydedildiğinde initializeUI() işlevini çağırmaktır:

navigator.serviceWorker.register('sw.js')
.then(function(swReg) {
  console.log('Service Worker is registered', swReg);

  swRegistration = swReg;
  initializeUI();
})

Deneyin

Push Codelab sekmesini yenileyin. Enable Push Messaging (Anlık Mesajlaşmayı Etkinleştir) düğmesinin etkinleştirildiğini (düğmeyi tıklayabilirsiniz) ve konsolda User is NOT subscribed simgesini görürsünüz.

Bu codelab'in geri kalanında ilerlerken abone olduğunuzda veya aboneliğinizi iptal ettiğinizde düğme metninin değiştiğini görmeniz gerekir.

Tamamlanmış kod

Şu anda Anlık Mesajlaşmayı Etkinleştir düğmeniz pek bir işe yaramıyor. Gelin bu sorunu çözelim.

initializeUI() işlevinde düğmeniz için bir tıklama işleyici ekleyin:

function initializeUI() {
  pushButton.addEventListener('click', function() {
    pushButton.disabled = true;
    if (isSubscribed) {
      // TODO: Unsubscribe user
    } else {
      subscribeUser();
    }
  });

  // Set the initial subscription value
  swRegistration.pushManager.getSubscription()
  .then(function(subscription) {
    isSubscribed = !(subscription === null);

    updateSubscriptionOnServer(subscription);

    if (isSubscribed) {
      console.log('User IS subscribed.');
    } else {
      console.log('User is NOT subscribed.');
    }

    updateBtn();
  });
}

Kullanıcı düğmeyi tıkladığında, push mesajlarına abone olma işlemi biraz zaman alabileceğinden kullanıcının düğmeyi ikinci kez tıklayamayacağından emin olmak için düğmeyi devre dışı bırakırsınız.

Kullanıcı abone değilse subscribeUser() işlevini çağırırsınız. Bunun için aşağıdaki kodu scripts/main.js içine yapıştırmanız gerekir:

function subscribeUser() {
  const applicationServerKey = urlB64ToUint8Array(applicationServerPublicKey);
  swRegistration.pushManager.subscribe({
    userVisibleOnly: true,
    applicationServerKey: applicationServerKey
  })
  .then(function(subscription) {
    console.log('User is subscribed.');

    updateSubscriptionOnServer(subscription);

    isSubscribed = true;

    updateBtn();
  })
  .catch(function(error) {
    console.error('Failed to subscribe the user: ', error);
    updateBtn();
  });
}

Bu kodun ne yaptığını ve kullanıcıyı push mesajlaşmaya nasıl kaydettiğini adım adım inceleyelim.

İlk olarak, uygulama sunucusunun Base64 URL güvenli kodlu ortak anahtarını alıp UInt8Array biçimine dönüştürürsünüz. Bunun nedeni, subscribe() çağrısının beklenen girişinin bu olmasıdır. urlB64ToUint8Array() işlevi, scripts/main.js'nin en üstünde yer alır.

Değeri dönüştürdükten sonra, subscribe() yöntemini hizmet çalışanı pushManager üzerinde çağırarak uygulama sunucunuzun ortak anahtarını ve değeri userVisibleOnly: true iletirsiniz.

const applicationServerKey = urlB64ToUint8Array(applicationServerPublicKey);
swRegistration.pushManager.subscribe({
  userVisibleOnly: true,
  applicationServerKey: applicationServerKey
})

userVisibleOnly parametresi, her push mesajı gönderildiğinde bildirim göstereceğinizin garantisidir. Şu anda bu değerin girilmesi zorunludur ve doğru olmalıdır.

subscribe() yöntemini çağırdığınızda aşağıdaki adımlardan sonra çözümlenecek bir söz döndürülür:

  1. Kullanıcı, bildirimlerin gösterilmesine izin vermiş olmalıdır.
  2. Tarayıcı, PushSubscription oluşturmak için gereken verileri almak üzere bir anlık bildirim hizmetine ağ isteği gönderdi.

Bu adımlar başarılı olursa subscribe() sözü PushSubscription ile sonuçlanır. Kullanıcı izin vermezse veya kullanıcıyı abone etmede herhangi bir sorun yaşanırsa söz hata vererek reddedilir. Bu, codelab'inizde aşağıdaki söz zincirini oluşturur:

swRegistration.pushManager.subscribe({
  userVisibleOnly: true,
  applicationServerKey: applicationServerKey
})
.then(function(subscription) {
  console.log('User is subscribed.');

  updateSubscriptionOnServer(subscription);

  isSubscribed = true;

  updateBtn();

})
.catch(function(err) {
  console.log('Failed to subscribe the user: ', err);
  updateBtn();
});

Bu durumda, kullanıcıyı abone olarak değerlendirip abonelik alırsınız veya bir hata yakalayıp bunu konsola kaydedersiniz. Her iki senaryoda da düğmenin yeniden etkinleştirildiğinden ve uygun metne sahip olduğundan emin olmak için updateBtn() numaralı telefonu ararsınız.

Gerçek bir uygulamada, abonelik verilerinizi bir arka uca göndereceğiniz yer updateSubscriptionOnServer() işlevidir. Ancak codelab'de aboneliği kullanıcı arayüzünüzde göstermeniz yeterlidir. scripts/main.js alanına aşağıdaki işlevi ekleyin:

function updateSubscriptionOnServer(subscription) {
  // TODO: Send subscription to application server

  const subscriptionJson = document.querySelector('.js-subscription-json');
  const subscriptionDetails =
    document.querySelector('.js-subscription-details');

  if (subscription) {
    subscriptionJson.textContent = JSON.stringify(subscription);
    subscriptionDetails.classList.remove('is-invisible');
  } else {
    subscriptionDetails.classList.add('is-invisible');
  }
}

Deneyin

Push Codelab sekmesine gidin, sayfayı yenileyin ve düğmeyi tıklayın. Aşağıdaki gibi bir izin istemi görürsünüz:

İzni verirseniz konsola User is subscribed kaydedildiğini görürsünüz. Düğmenin metni Anlık Mesajlaşmayı Devre Dışı Bırak olarak değişir ve aboneliği sayfanın alt kısmında JSON verileri olarak görüntüleyebilirsiniz.

Tamamlanmış kod

Henüz ele almadığınız bir konu, kullanıcının izin isteğini engellemesi durumunda ne olacağıdır. Kullanıcı izni engellerse web uygulamanız izin istemini yeniden gösteremeyeceği ve kullanıcıyı abone edemeyeceği için bu durum benzersiz bir değerlendirme gerektirir. Kullanıcının kullanılamadığını bilmesi için en azından basma düğmesini devre dışı bırakmanız gerekir.

Bu senaryoyu ele almak için en uygun yer updateBtn() işlevidir. Tek yapmanız gereken Notification.permission değerini aşağıdaki gibi kontrol etmektir:

function updateBtn() {
  if (Notification.permission === 'denied') {
    pushButton.textContent = 'Push Messaging Blocked';
    pushButton.disabled = true;
    updateSubscriptionOnServer(null);
    return;
  }

  if (isSubscribed) {
    pushButton.textContent = 'Disable Push Messaging';
  } else {
    pushButton.textContent = 'Enable Push Messaging';
  }

  pushButton.disabled = false;
}

İznin denied olması durumunda kullanıcının abone olamayacağını ve yapabileceğiniz başka bir şey olmadığını biliyorsunuz. Bu nedenle, düğmeyi kalıcı olarak devre dışı bırakmak en iyi yaklaşımdır.

Deneyin

Önceki adımda web uygulamanız için izin verdiğinizden, URL çubuğunda daire içindeki i simgesini tıklayıp Bildirimler iznini Genel varsayılanı kullan (Sor) olarak değiştirmeniz gerekir.

Bu ayarı değiştirdikten sonra sayfayı yenileyin, Anlık mesajlaşmayı etkinleştir düğmesini tıklayın ve izin iletişim kutusunda Engelle'yi seçin. Düğme devre dışı bırakılır ve Anlık Mesajlaşma Engellendi metni gösterilir.

Bu değişiklikle birlikte, olası izin senaryolarını göz önünde bulundurarak kullanıcıyı artık abone edebilirsiniz.

Tamamlanmış kod

Arka uçtan nasıl push mesajı göndereceğinizi öğrenmeden önce, abone olan bir kullanıcı push mesajı aldığında gerçekte ne olacağını göz önünde bulundurmanız gerekir.

Bir push mesajı tetiklediğinizde tarayıcı push mesajını alır, push'un hangi hizmet çalışanı için olduğunu anlar, bu hizmet çalışanını uyandırır ve bir push etkinliği gönderir. Bu etkinliği dinlemeniz ve sonuç olarak bir bildirim göstermeniz gerekir.

sw.js dosyanıza aşağıdaki kodu ekleyin:

self.addEventListener('push', function(event) {
  console.log('[Service Worker] Push Received.');
  console.log(`[Service Worker] Push had this data: "${event.data.text()}"`);

  const title = 'Push Codelab';
  const options = {
    body: 'Yay it works.',
    icon: 'images/icon.png',
    badge: 'images/badge.png'
  };

  event.waitUntil(self.registration.showNotification(title, options));
});

Bu kodu adım adım inceleyelim. Bir etkinlik işleyici ekleyerek hizmet çalışanı içinde push etkinliklerini dinliyorsunuz:

self.addEventListener('push', ... );

(Daha önce Web Workers ile çalışmadıysanız self muhtemelen yeni bir kavramdır. Bir hizmet çalışanı dosyasında self, hizmet çalışanının kendisini ifade eder.)

Bir push mesajı alındığında etkinlik dinleyici çağrılır ve hizmet çalışanının registration özelliğinde showNotification() çağrılarak bir bildirim oluşturulur. showNotification() için title gerekir. Ayrıca gövde mesajı, simge ve rozet ayarlamak için options nesnesi de verebilirsiniz. (Bu makalenin yazıldığı sırada rozet yalnızca Android'de kullanılmaktadır.)

const title = 'Push Codelab';
const options = {
  body: 'Yay it works.',
  icon: 'images/icon.png',
  badge: 'images/badge.png'
};
self.registration.showNotification(title, options);

push etkinlik işleme konusunda ele alınması gereken son nokta event.waitUntil(). Bu yöntem, tarayıcının, iletilen söz çözülene kadar hizmet çalışanınızı etkin ve çalışır durumda tutmasını sağlayan bir söz alır.

Yukarıdaki kodu biraz daha kolay anlaşılır hale getirmek için aşağıdaki gibi yeniden yazabilirsiniz:

const notificationPromise = self.registration.showNotification(title, options);
event.waitUntil(notificationPromise);

Push etkinliğini adım adım incelediğinize göre şimdi bir push etkinliğini test edelim.

Deneyin

Service worker'daki push etkinliği işleme özelliği sayesinde, bir mesaj alındığında ne olacağını test etmek için sahte bir push etkinliği tetikleyebilirsiniz.

Web uygulamanızda anlık mesajlaşma özelliğine abone olun ve konsolda User IS subscribed simgesini gördüğünüzden emin olun. Geliştirici Araçları'ndaki Uygulama panelinde, Service Workers sekmesinin altında Push düğmesini tıklayın:

Push'u tıkladıktan sonra aşağıdaki gibi bir bildirim görürsünüz:

Not: Bu adım işe yaramazsa DevTools Application panelindeki Unregister bağlantısını kullanarak hizmet çalışanın kaydını iptal etmeyi deneyin, hizmet çalışanın durdurulmasını bekleyin ve ardından sayfayı yeniden yükleyin.

Tamamlanmış kod

Bu bildirimlerden birini tıkladığınızda hiçbir şey olmaz. Servis çalışanınizda notificationclick etkinliklerini dinleyerek bildirim tıklamalarını işleyebilirsiniz.

notificationclick dinleyici ekleyerek başlayın sw.js:

self.addEventListener('notificationclick', function(event) {
  console.log('[Service Worker] Notification click received.');

  event.notification.close();

  event.waitUntil(
    clients.openWindow('https://developers.google.com/web')
  );
});

Kullanıcı bildirimi tıkladığında notificationclick etkinlik işleyicisi çağrılır.

Kod, önce tıklanan bildirimi kapatır:

event.notification.close();

Ardından, https://developers.google.com/web URL'sinin yüklendiği yeni bir pencere veya sekme açılır. Bu ayarı değiştirebilirsiniz.

event.waitUntil(
    clients.openWindow('https://developers.google.com/web/')
  );

event.waitUntil(), yeni pencere veya sekme gösterilmeden önce tarayıcının hizmet çalışanını sonlandırmamasını sağlar.

Deneyin

Geliştirici Araçları'nda tekrar bir push mesajı tetiklemeyi deneyin ve bildirimi tıklayın. Bildirimin kapandığını ve yeni bir sekmenin açıldığını görürsünüz.

Geliştirici Araçları'nı kullanarak web uygulamanızın bildirim gösterebildiğini gördünüz ve bildirimi tıklayarak nasıl kapatacağınızı öğrendiniz. Bir sonraki adım, gerçek bir anlık bildirim göndermektir.

Normalde bu işlem, bir web sayfasından arka uca abonelik göndermeyi gerektirir. Arka uç, abonelikteki uç noktaya bir API çağrısı yaparak push mesajını tetikler.

Bu, bu codelab'in kapsamı dışındadır ancak gerçek bir push mesajı tetiklemek için yardımcı siteyi (web-push-codelab.glitch.me) kullanabilirsiniz. Aboneliği sayfanızın en altına yapıştırın:

Ardından, bunu yardımcı sitedeki Subscription to Send To (Gönderilecekler Listesine Abonelik) metin alanına yapıştırın:

Gönderilecek Metin bölümünde, push mesajıyla göndermek istediğiniz dizeyi ekleyin.

Anlık mesaj gönder düğmesini tıklayın.

Ardından bir push mesajı alırsınız. Kullandığınız metin konsola kaydedilir.

Bu sayede, veri gönderme ve alma işlemlerini test edebilir, sonuç olarak bildirimleri değiştirebilirsiniz.

Yardımcı uygulama, ileti göndermek için web-push kitaplığını kullanan bir düğüm sunucusudur. Push mesajları göndermek için hangi kitaplıkların kullanılabildiğini görmek üzere GitHub'daki web-push-libs kuruluşunu incelemenizi öneririz. Bu, push mesajlarını tetiklemek için birçok ayrıntıyı ele alır.

Arkadaş sitesinin kodunun tamamını burada görebilirsiniz.

Tamamlanmış kod

Eksik olan tek şey, kullanıcıların push bildirimleri aboneliğinden çıkma özelliğidir. Bunun için PushSubscription üzerinden unsubscribe() numarasını aramanız gerekir.

scripts/main.js dosyanıza geri dönün ve initializeUI() içindeki pushButton tıklama işleyicisini aşağıdaki gibi değiştirin:

pushButton.addEventListener('click', function() {
  pushButton.disabled = true;
  if (isSubscribed) {
    unsubscribeUser();
  } else {
    subscribeUser();
  }
});

Şimdi yeni bir işlev unsubscribeUser() çağıracağınıza dikkat edin. Bu işlevde, geçerli aboneliği alıp üzerinde unsubscribe() işlevini çağırırsınız. Aşağıdaki kodu scripts/main.js dosyasına ekleyin:

function unsubscribeUser() {
  swRegistration.pushManager.getSubscription()
  .then(function(subscription) {
    if (subscription) {
      return subscription.unsubscribe();
    }
  })
  .catch(function(error) {
    console.log('Error unsubscribing', error);
  })
  .then(function() {
    updateSubscriptionOnServer(null);

    console.log('User is unsubscribed.');
    isSubscribed = false;

    updateBtn();
  });
}

Bu işlevi adım adım inceleyelim.

Öncelikle getSubscription() numaralı telefonu arayarak mevcut aboneliği alın:

swRegistration.pushManager.getSubscription()

Bu işlev, varsa PushSubscription ile çözümlenen bir söz döndürür; aksi takdirde null döndürür. Abonelik varsa unsubscribe() çağrısı yaparsınız. Bu durum, PushSubscription öğesini geçersiz kılar.

swRegistration.pushManager.getSubscription()
.then(function(subscription) {
  if (subscription) {
    // TODO: Tell application server to delete subscription
    return subscription.unsubscribe();
  }
})
.catch(function(error) {
  console.log('Error unsubscribing', error);
})

unsubscribe() işlevini çağırmak, tamamlanması biraz zaman alabileceğinden bir söz döndürür. Bu sözü döndürdüğünüzde zincirdeki sonraki then(), unsubscribe()'nin tamamlanmasını bekler. Ayrıca, unsubscribe() çağrısı hata verirse bir catch işleyici de eklersiniz. Bundan sonra kullanıcı arayüzünüzü güncelleyebilirsiniz.

.then(function() {
  updateSubscriptionOnServer(null);

  console.log('User is unsubscribed.');
  isSubscribed = false;

  updateBtn();
})

Deneyin

Web uygulamanızda Anlık Mesajlaşmayı Etkinleştir veya Anlık Mesajlaşmayı Devre Dışı Bırak'ı tıklayabilmeniz gerekir. Günlüklerde, kullanıcının abone olduğu ve abonelikten çıktığı gösterilir.

Bu codelab'i tamamladığınız için tebrikler.

Bu codelab'de, web uygulamanıza push bildirimleri ekleme konusunda nasıl çalışmaya başlayacağınız gösterildi. Web bildirimlerinin neler yapabileceği hakkında daha fazla bilgi edinmek istiyorsanız bu dokümanlara göz atın.

Sitenizde push bildirimleri dağıtmak istiyorsanız GCM kullanan eski tarayıcılar veya standartlara uygun olmayan tarayıcılar için destek eklemek isteyebilirsiniz. Daha fazla bilgi edinin.

Daha fazla bilgi

İlgili blog yayınları