Chrome 50'de Web Bildirimi İyileştirmeleri - Simgeler, Kapatma Etkinlikleri, Tercihleri ve Zaman Damgalarını Yeniden Bildirim

PPush bildirimleri, kullanıcılarınıza uygulama benzeri mükemmel bir deneyim sunarak, gelen sohbet mesajları gibi önemli ve zamanında yapılan güncellemeler konusunda kullanıcıları uyarmanıza olanak tanır. Bildirim platformu, tarayıcılar için nispeten yenidir. Giderek daha fazla kullanım alanı ve gereklilik ortaya çıktıkça, bildirimle ilgili API'lere birçok ekleme yapıldığını görüyoruz. Chrome 50 (Mart 2016'da yayınlanan beta sürümü), geliştiricilere bildirimler üzerinde daha fazla kontrol sağlayan en az dört yeni özellik sunarak bu konuda istisna değildir. Şunları yapabilirsiniz:

  • bildirim düğmelerine simge ekleme,
  • tutarlı bir deneyim sunmak için zaman damgasını değiştirebilirsiniz.
  • bildirimleri senkronize etmek ve analizler sağlamak için bildirim kapatma etkinliklerini izleyin.
  • bildirim, görüntülenmekte olan bildirimin yerini aldığında yeniden bildirim deneyimini yönetebilir.

Chrome 50'de Push bildirimleri için Yükler de eklendi. Chrome'da uygulandığı anda Notifications API'den haberdar olmak için spec ve özellik sorunu izleyicisini izleyin.

Özel simgelerle etkileyici işlem düğmeleri oluşturun

Chrome 49'daki bildirim işlem düğmeleriyle ilgili kısa süre önce yayınladığım bir yayında, bildirim düğmelerinin şık ve ilgi çekici olmasını sağlayacak resimleri ekleyemeyeceğinizi ancak satır içi emojiler için Unicode karakterleri kullanabileceğinizi belirtmiştim. Artık endişelenmenize gerek yok: Bu yeni özellik sayesinde artık işlem düğmesinde bir resim belirtebilirsiniz:

self.registration.showNotification('New message from Alice', {
  actions: [
    {action: 'like', title: 'Like', icon: 'https://example/like.png'},
    {action: 'reply', title: 'Reply', icon: 'https://example/reply.png'}]
});
Masaüstü bildirimi

İşlem simgesinin görünümü platforma göre değişir. Örneğin, Android'de simge, Lollipop ve sonraki sürümlerde koyu gri bir filtre, masaüstünde ise tam renkli, Lollipop öncesi beyaz filtre bulunur. (Not: Masaüstünde bunun geleceği hakkında tartışmalar yaşanıyor.) Bazı platformlarda işlem simgeleri bile gösterilmeyebilir. Bu nedenle, simgeleri yalnızca amacın göstergesi olarak değil, işlemle ilgili bağlam sunmak amacıyla kullandığınızdan emin olun.

Son olarak, kaynakların indirilmesi gerektiğinden simgeleri mümkün olduğunca küçük tutmak ve yükleme etkinliğinizde önceden önbelleğe almak iyi bir uygulamadır. (Bu yazının yazıldığı tarihte, Chrome'daki bildirim kaynaklarının getirilmesi henüz Service Worker üzerinden yönlendirilmemiştir.)

Bildirim kapatma etkinlikleri

Bildirimlerin sıkça istenen bir özelliği de kullanıcının bir bildirimi ne zaman kapattığını bilmesidir. Bildirim spesifikasyonunda kısa süre önce yapılan bir dizi değişiklik bir Notificationclose etkinliği ekleyene kadar bunu yapabilmemiz mümkün değildi.

Notificationclick ve notificationclose etkinliğini kullanarak kullanıcılarınızın bildirimleriniz ile nasıl etkileşimde bulunduğunu anlayabilirsiniz. Bunları uzun süre açık bırakıp sonra aktif olarak kapatıyorlar mı yoksa üzerlerinde hemen mi davranıyorlar?

En yaygın kullanım alanlarından biri bildirimleri cihazlar arasında senkronize edebilmektir. Kullanıcı bir bildirimi masaüstü cihazında kapatırsa aynı bildirim mobil cihazında da kapatılmalıdır. Henüz bunu sessizce yapma gibi bir imkan yoktur (her push mesajında bir bildirim görüntülenmesi gerektiğini unutmayın). Ancak, bildirimleri kullanarak sunucunuzdaki kullanıcının bildirim durumunu takip edip kullanıcı bunları kullandıkça bunu diğer cihazlarla senkronize etmenize olanak tanıyarak bu işlemi gerçekleştirme olanağını açar.

Notificationclose etkinliğini kullanmak için hizmet çalışanınızda kaydedin. Bu etkinlik yalnızca kullanıcı bir bildirimi etkin bir şekilde kapattığında (ör. kullanıcı belirli bir bildirimi veya tepsisindeki tüm bildirimleri kapattığında) etkinleşir (Android'de).

şart etkileşimi işareti false (yanlış) değerine ayarlanır veya ayarlanmadan bırakılırsa bildirim, kullanıcı tarafından manuel olarak değil, sistem tarafından otomatik olarak kapatılırsa, notificationclose etkinliği tetiklenmez.

Basit bir uygulama aşağıda gösterilmiştir. Kullanıcı bildirimi kapattığında özel mantık gerçekleştirebileceğiniz bildirim nesnesine erişim elde edersiniz.

self.addEventListener('notificationclose', e => console.log(e.notification));

Bunu Bildirim Oluşturucu'da test edebilirsiniz. Bildirimi kapattığınızda bir uyarı alırsınız.

Mevcut bir bildirimi değiştirdiğinizde kullanıcılarınızı rahatsız etmeyin

"Büyük güç büyük sorumluluk büyük sorumluluktur" dediğinde Ben Amca'nın Peter Parker'ın güçlerinden değil, bildirim sisteminden söz ettiğine eminim. Bildirim sistemi, kullanıcılarla etkileşim için güçlü bir araçtır. Güvenini kötüye kullanırsanız tüm bildirimler devre dışı bırakılır ve bildirimleri tamamen kaybedebilirsiniz.

Bir bildirim oluşturduğunuzda, kullanıcının dikkatini çekmek için bildirimi sesli uyarı veya titreşim oluşturacak şekilde ayarlayabilirsiniz. Ayrıca, mevcut bir bildirimi yeni bir bildirim nesnesinde "etiket" özelliğini yeniden kullanarak değiştirebilirsiniz.

Chrome 50'den önce, bir bildirim oluşturduğunuzda veya mevcut bir bildirimi değiştirdiğinizde, bildirimler titreşim deseni çalıştırır veya sesli bir uyarı verirdi ve bu da kullanıcılarınızı hayal kırıklığına uğratabilirdi. Artık Chrome 50'de "renotify" adlı basit bir boole flag'ini kullanarak yeniden bildirim sırasında neler olacağını kontrol edebilirsiniz. Sonraki bildirimler için aynı "etiket" kullanılırken yeni varsayılan davranış sessiz olmaktır ve geliştirici olarak bayrağı "true" (doğru) değerine ayarlayarak kullanıcıyı "yeniden bilgilendirme" seçeneğini etkinleştirmeniz gerekir.

self.registration.showNotification('Oi!', {
  'renotify': true,
  'tag': 'tag-id-1'
});

Bunu Bildirim Oluşturma Aracı'nda deneyebilirsiniz.

Kullanıcıya gösterilen zaman damgasını yönetin

Android'de, Chrome bildirimlerinde varsayılan olarak sağ üst köşede oluşturma zamanları gösterilir. Maalesef bu, bildirimin aslında sisteminiz tarafından oluşturulduğu zaman olmayabilir. Örneğin, cihaz çevrimdışıyken etkinlik tetiklenmiş olabilir veya bildirim, yaklaşan bir toplantı için gösterilebilir. Chrome 50 sürümünden itibaren Chrome, geliştiricilerin bildirimde görüntülenmesi gereken zamanı sağlamasına olanak tanıyan yeni bir "timestamp" özelliği ekledi.

self.registration.showNotification('Best day evar!', {
  'timestamp': 360370800000
});

Zaman damgası şu anda yalnızca Android için Chrome'da görünür. Masaüstünde görünür olmasa da, hem mobil hem de masaüstü cihazlarda bildirim sırasını etkiler.