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 göstermek için Web Notifications API. Bu özellik genellikle Kullanıcıyı aşağıdakiler gibi zaman açısından hassas bilgiler hakkında bilgilendirmek için API aktarma flaş haberler veya aldığınız mesajlar gibi. Bildirimler, cihazıyla oturum açın.

Push API'sindeki sorun, API'nin sağlanması gereken bildirimleri tetikleme konusunda güvenilir olmamasıdır. zaman veya yer gibi belirli bir koşul karşılandığında gösterilir. Zamana dayalı durum, patronunuzla yaptığınız önemli bir toplantıyı hatırlatan bir takvim bildirimidir: 14:00 Konuma dayalı durumlara örnek olarak, süt satın almanızı hatırlatan bildirimler verilebilir çok kolay olduğunu fark edeceksiniz. Ağ bağlantısı veya pili koruma doz modu gibi özellikler, push tabanlı bildirimlerin iletilmesini geciktirebilir.

Bildirim tetikleyicileri, bildirimleri tetiklenecek şekilde planlamanıza olanak tanıyarak bu sorunu çözer. durumu önceden anlamanızı sağlar. Böylece, işletim sistemi bildirimi doğru zamanda Ağ bağlantısı olmasa veya cihaz pil tasarrufu modunda olsa bile

Kullanım alanları

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

TV ağı, kullanıcılara favori TV programının başlamak üzere veya bir konferansın canlı olarak düzenleneceğini hatırlatabilir akış başlamak üzere.

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

Mevcut durum

Bildirim tetikleyicileri nasıl kullanılır?

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

Bildirim Tetikleyiciler API'sini kaynak deneme jetonu olmadan yerel olarak denemek için about://flags bölgesinde #enable-experimental-web-platform-features işareti.

Özellik algılama

Tarayıcının, bildirim tetikleyicilerini destekleyip desteklemediğini, showTrigger mülk:

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

Bildirim planlama

Bildirim planlama, normal push bildirimleri göstermeye benzer, ancak tek yapmanız gereken showTrigger koşul özelliğini TimestampTrigger nesnesiyle bildirimin options nesnesi.

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 belirli bir bildirimle eşleşen tüm bildirimlerin listesini isteyin ServiceWorkerRegistration.getNotifications() aracılığıyla etiketleyin. Projenin başarılı olması için Planlanan bildirimlerin listeye dahil edilmesi için includeTriggered işareti:

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. Başlamak için hata ayıklama işlemi için Etkinlikleri kaydetmeyi başlat'a basın veya Control+E (Mac'te Command+E) tuşlarına basın. Chrome Geliştirici Araçları kayıtları üç gün boyunca planlanmış, görüntülenen ve kapatılan bildirimler dahil olmak üzere tüm bildirim etkinliklerini Geliştirici Araçları kapalıyken bile.

ziyaret edin.

Demo

Demoda Bildirim Tetikleyicilerini uygulamalı olarak görebilirsiniz. Demoda, planlama planlanan bildirimleri listeleyebilir ve iptal edebilirsiniz. Kaynak kodu şurada kullanılabilir: Aksak.

Güvenlik ve izinler

Chrome ekibi, Bildirim Tetikleyicileri API'sini temel ilkeleri kullanarak tasarlamış ve uygulamıştır: Kullanıcı erişimi dahil olmak üzere Güçlü Web Platformu Özelliklerine Erişimi Kontrol Etme'de tanımlanmıştır kontrol, şeffaflık ve ergonomi. Bu API, hizmet çalışanları gerektirdiğinden bahsedeceğiz. API'yi kullanmak, normal push bildirimleriyle aynı izni gerektirir.

Kullanıcı denetimi

Bu API yalnızca ServiceWorkerRegistration bağlamında kullanılabilir. Bu, tüm özelliklerin gereken veriler aynı bağlamda depolanır ve hizmet çalışanı şu işlemleri gerçekleştirdiğinde otomatik olarak silinir: silindiğinde veya kullanıcı, kaynağa ait tüm site verilerini siler. Çerezlerin engellenmesi, hizmetin yüklenmesini ve dolayısıyla bu API'nin kullanılmasını engeller. Bildirimler kullanıcı tarafından site ayarlarında her zaman devre dışı bırakılmış olabilir.

Şeffaflık

Push API'sinin aksine bu API ağa bağlı değildir. Bu da, planlanmış bildirimler anlamına gelir. badge, icon ve image özellikleri. 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ırma işlemi bu kapsama dahil değildir. Dolayısıyla, geliştiricinin şu an için kullanıcı hakkında bilgi edinebileceği bilinen bir yol yoktur. . Bu tasarım ayrıca özelliğin, isteğe bağlı olarak işletim sistemi tarafından sağlanan zaman çizelgesi mekanizmalarından yararlanmasına olanak tanır. örneğin Android'in AlarmManager, Bu da pil tasarrufu sağlar.

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? Veya eksik yöntemler mi var? gereken özellikler veya özellikler neler olabilir? Menkul kıymetle ilgili bir sorunuz veya yorumunuz varsa modeli nedir? Bildirim Tetikleyicileri GitHub deposunda bir spesifikasyon sorunu bildirin veya düşüncelerinizi şuraya ekleyin: bir sorun olabilir.

Uygulamayla ilgili bir sorun mu var?

Chrome'un uygulanmasıyla ilgili bir hata buldunuz mu? Yoksa uygulama, spesifikasyondan farklı mı? new.crbug.com adresinden hata bildiriminde bulunun. Açıklamalarınızı mümkün oldukça detaylandırmaya çalışın. basit yeniden oluşturma talimatlarını uygulayın ve Bileşenler'i UI>Notifications olarak ayarlayın. Arıza çok iyi sonuç veriyor hızlı ve kolay hata replikaları paylaşmak için.

API'yi kullanmayı mı planlıyorsunuz?

Sitenizde Bildirim Tetikleyicilerini kullanmayı mı planlıyorsunuz? Herkese açık desteğiniz, öncelik vermemize ve diğer tarayıcı tedarikçilerine söz konusu özellikleri desteklemenin ne kadar önemli olduğunu gösterir. Şu kullanıcıya tweet gönder: @ChromiumDev hashtag'ini kullanarak #NotificationTriggers ve 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 tarafından uygulandı Peter Beverloo'nun yazdığı açıklayıcı video ise katkılarında bulunuyor. Makale, aşağıdaki kullanıcılar tarafından yorumlandı: Joe Medley, Pete LePage ve Richard ve Peter. Hero resim: Lukas Blazek, Unsplash'te.