API триггеров уведомлений

Notification Triggers позволяет планировать локальные уведомления, не требующие подключения к сети, что делает их идеальными для таких случаев использования, как приложения-календари.

Thomas Steiner

Что такое триггеры уведомлений?

Веб-разработчики могут отображать уведомления с помощью API веб-уведомлений . Эта функция часто используется с API Push для информирования пользователя о срочной информации, например, о срочных новостях или полученных сообщениях. Уведомления отображаются путем запуска JavaScript на устройстве пользователя.

Проблема с Push API заключается в том, что он ненадежен для запуска уведомлений, которые должны отображаться при выполнении определенного условия, например, времени или местоположения. Примером условия, основанного на времени, является уведомление календаря, которое напоминает вам о важной встрече с вашим боссом в 14:00. Примером условия, основанного на местоположении, является уведомление, которое напоминает вам купить молока, когда вы входите в близость вашего продуктового магазина. Сетевое подключение или функции экономии заряда батареи, такие как режим ожидания, могут задерживать доставку push-уведомлений.

Триггеры уведомлений решают эту проблему, позволяя вам заранее планировать уведомления с условием их срабатывания, чтобы операционная система доставляла уведомления в нужное время, даже если отсутствует подключение к сети или устройство находится в режиме экономии заряда батареи.

Варианты использования

Приложения календаря могут использовать основанные на времени триггеры уведомлений, чтобы напоминать пользователю о предстоящих встречах. Схема уведомлений по умолчанию для приложения календаря может заключаться в том, чтобы показывать первое уведомление за час до встречи, а затем еще одно более срочное уведомление за пять минут до нее.

Телевизионная сеть может напомнить пользователям о том, что скоро начнется их любимое телешоу или прямая трансляция конференции.

Сайты, преобразующие часовые пояса, могут использовать основанные на времени триггеры уведомлений, чтобы позволить своим пользователям планировать оповещения для телефонных конференций или видеозвонков.

Текущий статус

Как использовать триггеры уведомлений

Включение через about://flags

Чтобы поэкспериментировать с API триггеров уведомлений локально, без пробного токена источника, включите флаг #enable-experimental-web-platform-features в about://flags .

Обнаружение особенностей

Узнать, поддерживает ли браузер триггеры уведомлений, можно, проверив наличие свойства showTrigger :

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

Планирование уведомления

Планирование уведомления похоже на показ обычного push-уведомления, за исключением того, что вам необходимо передать свойство условия showTrigger с объектом TimestampTrigger в качестве значения объекту options уведомления.

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),
  });
};

Отмена запланированного уведомления

Чтобы отменить запланированные уведомления, сначала запросите список всех уведомлений, которые соответствуют определенному тегу через ServiceWorkerRegistration.getNotifications() . Обратите внимание, что вам нужно передать флаг includeTriggered для включения запланированных уведомлений в список:

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

Отладка

Вы можете использовать панель Chrome DevTools Notifications для отладки уведомлений. Чтобы начать отладку, нажмите Start recording events или Control + E ( Command + E на Mac). Chrome DevTools записывает все события уведомлений, включая запланированные, отображаемые и закрытые уведомления, в течение трех дней, даже когда DevTools закрыт.

Демо

Вы можете увидеть Notification Triggers в действии в демо , которое позволяет вам планировать уведомления, составлять список запланированных уведомлений и отменять их. Исходный код доступен на Glitch .

Безопасность и разрешения

Команда Chrome разработала и внедрила API Notification Triggers, используя основные принципы, определенные в Controlling Access to Powerful Web Platform Features , включая пользовательский контроль, прозрачность и эргономику. Поскольку этот API требует Service Workers, он также требует безопасного контекста. Использование API требует того же разрешения, что и обычные push-уведомления.

Пользовательский контроль

Этот API доступен только в контексте ServiceWorkerRegistration . Это подразумевает, что все требуемые данные хранятся в том же контексте и автоматически удаляются при удалении service worker или удалении пользователем всех данных сайта для источника. Блокировка файлов cookie также предотвращает установку service worker в Chrome и, следовательно, использование этого API. Пользователь всегда может отключить уведомления для сайта в настройках сайта.

Прозрачность

В отличие от Push API, этот API не зависит от сети, что подразумевает, что запланированным уведомлениям нужны все необходимые данные заранее, включая ресурсы изображений, на которые ссылаются атрибуты badge , icon и image . Это означает, что показ запланированного уведомления не наблюдается разработчиком и не требует пробуждения service worker до тех пор, пока пользователь не взаимодействует с уведомлением. Следовательно, в настоящее время нет известного способа, которым разработчик мог бы получить информацию о пользователе с помощью потенциально нарушающих конфиденциальность подходов, таких как поиск геолокации IP-адреса. Эта конструкция также позволяет функции опционально использовать механизмы планирования, предоставляемые операционной системой, такие как AlarmManager Android, что помогает экономить заряд батареи.

Обратная связь

Команда Chrome хочет узнать о вашем опыте работы с триггерами уведомлений.

Расскажите нам о дизайне API

Есть ли что-то в API, что работает не так, как вы ожидали? Или отсутствуют методы или свойства, которые вам нужны для реализации вашей идеи? У вас есть вопрос или комментарий по модели безопасности? Отправьте запрос спецификации в репозиторий Notification Triggers GitHub или добавьте свои мысли к существующему запросу.

Проблемы с реализацией?

Вы нашли ошибку в реализации Chrome? Или реализация отличается от спецификации? Сообщите об ошибке на new.crbug.com . Обязательно включите как можно больше подробностей, простые инструкции по воспроизведению и установите Components в UI>Notifications . Glitch отлично подходит для быстрого и простого распространения воспроизведения ошибок.

Планируете использовать API?

Планируете использовать Notification Triggers на своем сайте? Ваша публичная поддержка помогает нам расставлять приоритеты функций и показывает другим поставщикам браузеров, насколько важно их поддерживать. Отправьте твит @ChromiumDev с хэштегом #NotificationTriggers и расскажите, где и как вы его используете.

Полезные ссылки

• Публичный объяснитель
• Демонстрация триггеров уведомлений | Источник демонстрационной версии триггеров уведомлений
• Ошибка отслеживания
• Запись ChromeStatus.com
• Компонент Blink: UI>Notifications

Благодарности

Notification Triggers был реализован Ричардом Кноллом , а объяснение написано Питером Беверлоо , с участием Ричарда. Следующие люди рецензировали статью: Джо Медли , Пит ЛеПейдж , а также Ричард и Питер. Изображение героя от Лукаса Блажек на Unsplash.