Bildirim Tetikleyicileri API'si

Bildirim Tetikleyicileri, ağ bağlantısı gerektirmeyen yerel bildirimleri planlamanıza olanak tanır. Bu da takvim uygulamaları gibi kullanım alanları için idealdir.

Thomas Steiner

Bildirim Tetikleyicileri nedir?

Web geliştiricileri, bildirimleri Web Notifications API'yi kullanarak görüntüleyebilir. Bu özellik genellikle kullanıcıyı son dakika haberleri veya alınan mesajlar gibi zamana bağlı bilgiler konusunda bilgilendirmek için Push API ile birlikte kullanılır. Bildirimler, kullanıcının cihazında JavaScript çalıştırılarak gösterilir.

Push API'deki sorun, zaman veya konum gibi belirli bir koşul karşılandığında gösterilmesi gereken bildirimleri tetiklemenin güvenilir olmamasıdır. Zamana dayalı koşullara örnek olarak 14:00'da patronunuzla yapacağınız önemli bir toplantıyı hatırlatan takvim bildirimi verilebilir. Konuma dayalı durum örneği, marketinizin yakınlarına girdiğinizde süt almanızı hatırlatan bir bildirimdir. Ağ bağlantısı veya doz modu gibi pili koruyan özellikler, push tabanlı bildirimlerin iletimini geciktirebilir.

Bildirim tetikleyicileri, bildirimleri tetikleme durumlarıyla önceden planlamanıza izin vererek bu sorunu çözer. Böylece, ağ bağlantısı olmasa veya cihaz pil tasarrufu modunda olsa bile işletim sistemi bildirimi doğru zamanda teslim eder.

Kullanım alanları

Takvim uygulamaları, bir kullanıcıya yaklaşan toplantıları hatırlatmak için zamana dayalı bildirim tetikleyicileri kullanabilir. Bir takvim uygulamasının varsayılan bildirim şeması, toplantıdan bir saat önce ilk uyarı bildirimini ve beş dakika önce başka bir daha acil bildirim göstermek olabilir.

Bir TV ağı, kullanıcılara favori TV programının başlamak üzere veya bir konferans canlı yayınının başlamak üzere olduğunu hatırlatabilir.

Saat dilimi dönüştürme siteleri, kullanıcılarının telefon konferansları veya görüntülü görüşmeler için alarm planlamasına olanak tanımak amacıyla zamana dayalı bildirim tetikleyicileri kullanabilir.

Mevcut durum

Bildirim tetikleyicileri nasıl kullanılır?

about://flags aracılığıyla etkinleştirme

Notification Triggers API'yi kaynak deneme jetonu olmadan yerel olarak denemek için about://flags uygulamasında #enable-experimental-web-platform-features işaretini etkinleştirin.

Özellik algılama

showTrigger özelliğinin olup olmadığını kontrol ederek tarayıcının Bildirim Tetikleyicilerini destekleyip desteklemediğini öğrenebilirsiniz:

if ('showTrigger' in Notification.prototype) {
  /* Notification Triggers supported */
}

Bildirim planlama

Bildirim planlamak, normal push bildirimi göstermeye benzer. Tek fark, bildirimin options nesnesine değer olarak TimestampTrigger nesnesiyle bir showTrigger koşul özelliği iletmeniz gerekir.

const createScheduledNotification = async (tag, title, timestamp) => {
  const registration = await navigator.serviceWorker.getRegistration();
  registration.showNotification(title, {
    tag: tag,
    body: 'This notification was scheduled 30 seconds ago',
    showTrigger: new TimestampTrigger(timestamp + 30 * 1000),
  });
};

Planlanmış bir bildirimi iptal etme

Planlanmış bildirimleri iptal etmek için önce ServiceWorkerRegistration.getNotifications() tarihine kadar belirli bir etiketle eşleşen tüm bildirimlerin listesini isteyin. Planlanmış bildirimlerin listeye dahil edilmesi için includeTriggered işaretini geçmeniz gerektiğini unutmayın:

const cancelScheduledNotification = async (tag) => {
  const registration = await navigator.serviceWorker.getRegistration();
  const notifications = await registration.getNotifications({
    tag: tag,
    includeTriggered: true,
  });
  notifications.forEach((notification) => notification.close());
};

Hata ayıklama

Hata ayıklamak için Chrome Geliştirici Araçları Bildirimler panelini kullanabilirsiniz. Hata ayıklamayı başlatmak için Etkinlikleri kaydetmeyi başlat veya Control+E (Mac'te Command+E) tuşlarına basın. Chrome Geliştirici Araçları; planlanmış, gösterilen ve kapalı bildirimler de dahil olmak üzere tüm bildirim etkinliklerini, Geliştirici Araçları kapalıyken bile üç gün boyunca kaydeder.

Demo

Demoda Bildirim Tetikleyicilerini çalışırken görebilirsiniz. Bu sayede bildirimleri planlamanıza, planlanan bildirimleri listelemenize ve iptal etmenize olanak tanır. Kaynak kodu Glitch'te mevcuttur.

Güvenlik ve izinler

Chrome ekibi, kullanıcı kontrolü, şeffaflık ve ergonomik gibi Güçlü Web Platformu Özelliklerine Erişimi Kontrol Etme bölümünde tanımlanan temel ilkeleri kullanarak Notification Triggers API'yi tasarlamış ve uygulamıştır. Bu API, hizmet çalışanları gerektirdiğinden güvenli bir bağlam da gerektirir. API'yi kullanmak, normal push bildirimleriyle aynı izni gerektirir.

Kullanıcı denetimi

Bu API yalnızca ServiceWorkerRegistration bağlamında kullanılabilir. Bu, gerekli tüm verilerin aynı bağlamda depolandığı ve Service Worker silindiğinde veya kullanıcı kaynakla ilgili tüm site verilerini sildiğinde otomatik olarak silineceği anlamına gelir. Çerezleri engellemek, hizmet çalışanlarının Chrome'a yüklenmesini ve dolayısıyla bu API'nin kullanılmasını da engeller. Site ayarlarında site için bildirimler kullanıcı tarafından her zaman devre dışı bırakılabilir.

Şeffaflık

Push API'sinin aksine bu API ağa bağlı değildir. Bu da, planlı bildirimlerde badge, icon ve image özelliklerinin referans verdiği görüntü kaynakları dahil olmak üzere gerekli tüm verilerin önceden gerekli olduğu anlamına gelir. Bu, planlanmış bir bildirimin gösterilmesinin geliştirici tarafından gözlemlenmeyeceği anlamına gelir ve kullanıcı bildirimle etkileşime girene kadar Service Worker'ı uyandırmayı içermez. Dolayısıyla, geliştiricinin şu anda IP adresi coğrafi konum araması gibi gizliliği ihlal eden yaklaşımlar aracılığıyla kullanıcı hakkında bilgi edinebileceği bilinen bir yol yoktur. Bu tasarım ayrıca özelliğin, pil tasarrufu yapmaya yardımcı olan Android AlarmManager gibi işletim sistemi tarafından sağlanan planlama mekanizmalarından isteğe bağlı olarak yararlanmasına da olanak tanır.

Geri bildirim

Chrome ekibi, bildirim tetikleyicileriyle ilgili deneyimleriniz hakkında bilgi almak istiyor.

Bize API tasarımı hakkında bilgi verin

API'de beklediğiniz gibi çalışmayan bir şey mi var? Yoksa fikrinizi uygulamak için ihtiyacınız olan yöntemler veya özellikler mi var? Güvenlik modeliyle ilgili sorunuz veya yorumunuz mu var? Bildirim Tetikleyicileri GitHub deposunda spesifikasyon sorunu bildirin veya mevcut bir soruna düşüncelerinizi ekleyin.

Uygulamayla ilgili bir sorun mu var?

Chrome'un uygulanmasıyla ilgili bir hata buldunuz mu? Yoksa uygulama, spesifikasyondan farklı mı? new.crbug.com adresinde bir hata bildiriminde bulunun. Mümkün olduğunca çok ayrıntı eklediğinizden, yeniden oluşturma için basit talimatlar sağladığınızdan ve Bileşenler'i UI>Notifications olarak ayarladığınızdan emin olun. Glitch, hata yeniden oluşturma işlemlerini hızlı ve kolay bir şekilde paylaşmak için idealdir.

API'yi kullanmayı mı planlıyorsunuz?

Sitenizde Bildirim Tetikleyicilerini kullanmayı mı planlıyorsunuz? Herkese açık desteğiniz, özellikleri önceliklendirmemize yardımcı olur ve diğer tarayıcı tedarikçilerine bunları desteklemenin ne kadar önemli olduğunu gösterir. #NotificationTriggers hashtag'ini kullanarak @ChromiumDev'e bir tweet gönderin ve etiketi nerede ve nasıl kullandığınızı bize bildirin.

Yararlı Bağlantılar

• Herkese açık açıklayıcı
• Bildirim Tetikleyicileri demosu | Bildirim Tetikleyicileri demo kaynağı
• Hata izleme
• ChromeStatus.com girişi
• Blink Bileşeni: UI>Notifications

Teşekkür

Bildirim Tetikleyicileri, Richard Knoll ve Peter Beverloo tarafından yazılan açıklayıcı tarafından Richard'ın katkılarıyla birlikte uygulandı. Şu kullanıcılar makaleyi incelemiştir: Joe Medley, Pete LePage ve Richard ve Peter. Unsplash'teki Lukas Blazek'ten hero resim.