Bildirim Tetikleyicileri API'si

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

Thomas Steiner

Bildirim tetikleyicileri nedir?

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

Push API'nin sorunu, zaman veya konum gibi belirli bir koşul karşılandığında gösterilmesi gereken bildirimleri tetikleme konusunda güvenilir olmamasıdır. Zamana dayalı koşul örneği olarak, 14:00'te patronunuzla yapacağınız önemli bir toplantıyı hatırlatan bir takvim bildirimi verilebilir. Konum tabanlı koşul örneği olarak, marketinizin yakınına geldiğinizde süt almanızı hatırlatan bir bildirim verilebilir. Ağ bağlantısı veya pil tasarrufu sağlayan özellikler (ör. Uyku modu) push tabanlı bildirimlerin teslimini geciktirebilir.

Bildirim tetikleyicileri, bildirimleri tetikleyici koşullarıyla birlikte önceden planlamanıza olanak tanıyarak bu sorunu çözer. Böylece işletim sistemi, ağ bağlantısı olmasa veya cihaz pil tasarrufu modunda olsa bile bildirimi doğru zamanda gönderir.

Kullanım alanları

Takvim uygulamaları, kullanıcılara 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 ardından beş dakika önce daha acil bir bildirim göstermek olabilir.

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

Saat dilimi dönüşümü siteleri, kullanıcılarının telefon konferansları veya görüntülü görüşmeler için alarmlar planlamasına izin vermek amacıyla zamana dayalı bildirim tetikleyicileri kullanabilir.

Mevcut durum

Bildirim tetikleyicilerini kullanma

about://flags üzerinden etkinleştirme

Notification Triggers API'yi kaynak deneme jetonu olmadan yerel olarak denemek için about://flags dosyası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 planlama, normal bir push bildirimi göstermeye benzer. Tek fark, bildirimin options nesnesine değer olarak bir TimestampTrigger nesnesi içeren bir showTrigger koşul mülkü göndermeniz gerektiğidir.

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ıklama işlemini başlatmak için Etkinlikleri kaydetmeye başla simgesine veya Ctrl+E (Mac'te Komut+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

Bildirim tetikleyicileri, demo'da çalışırken görebilirsiniz. Bu demo, bildirimleri planlamanıza, planlanmış bildirimleri listelemenize ve iptal etmenize olanak tanır. Kaynak kodu Glitch'te mevcuttur.

Güvenlik ve izinler

Chrome ekibi, Notification Triggers API'yi tasarlarken ve uygularken kullanıcı denetimi, şeffaflık ve ergonomi gibi Güçlü Web Platformu Özelliklerine Erişimi Kontrol Etme başlıklı makalede belirtilen temel ilkeleri temel almış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 hizmet çalışanı silindiğinde veya kullanıcı kaynak için tüm site verilerini sildiğinde otomatik olarak silindiğ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. Bildirimler, site ayarları bölümünden kullanıcı tarafından her zaman devre dışı bırakılabilir.

Şeffaflık

Push API'nin aksine bu API ağa bağlı değildir. Bu, planlanmış bildirimlerin badge, icon ve image özelliklerinin referans verdiği resim kaynakları da dahil olmak üzere önceden gerekli tüm verilere ihtiyaç duyduğu anlamına gelir. Bu, planlanmış bir bildirimin gösterilmesinin geliştirici tarafından gözlemlenemediği ve kullanıcı bildirimle etkileşime geçene kadar hizmet çalışanının uyandırılmadığı anlamına gelir. Sonuç olarak, geliştiricinin IP adresi coğrafi konum araması gibi gizliliği ihlal edebilecek yaklaşımlar aracılığıyla kullanıcı hakkında bilgi edinebileceği bilinen bir yöntem şu anda mevcut değildir. Bu tasarım, özelliğin isteğe bağlı olarak işletim sistemi tarafından sağlanan planlama mekanizmalarına (ör. Android'in AlarmManager) erişmesine de olanak tanır. Bu sayede pil tasarrufu sağlanır.

Geri bildirim

Chrome Ekibi, bildirim tetikleyicilerle ilgili deneyimlerinizi öğrenmek istiyor.

API tasarımı hakkında bilgi verin

API'de beklediğiniz gibi çalışmayan bir şey mi var? Yoksa fikrinizi uygulamak için ihtiyaç duyduğunuz yöntemler veya özellikler eksik mi? Güvenlik modeliyle ilgili sorunuz veya yorumunuz mu var? Bildirim Tetikleyicileri GitHub deposunda özellik sorunu gönderin veya mevcut bir soruna düşüncelerinizi ekleyin.

Uygulamayla ilgili sorun mu yaşıyorsunuz?

Chrome'un uygulanmasıyla ilgili bir hata buldunuz mu? Yoksa uygulama, spesifikasyondan farklı mı? new.crbug.com adresinden hata kaydı oluşturun. Mümkün olduğunca fazla ayrıntı ekleyin, hatayı yeniden oluşturmayla ilgili basit talimatlar verin ve Bileşenler'i UI>Notifications olarak ayarlayın. Glitch, hataları hızlı ve kolay bir şekilde yeniden oluşturarak paylaşmak için mükemmel bir araçtır.

API'yi kullanmayı planlıyor musunuz?

Sitenizde bildirim tetikleyicileri kullanmayı planlıyor musunuz? 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çıklama
• Bildirim Tetikleyicileri demosu | Bildirim Tetikleyicileri demo kaynağı
• İzleme hatası
• ChromeStatus.com girişi
• Blink Bileşeni: UI>Notifications

Teşekkür ederiz

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