TGViewer
<divelopers> <divelopers> @alexnozer_dev · 1.18K subscribers
Post #200 1.06K
Badging API

У нативных приложений есть возможность отображать бейдж в углу иконки приложения. Это способ показать пользователям, что какие-то события требуют внимания: новые сообщения, незавершённые задачи, уведомления и так далее. Badging API предоставляет возможность установить такой значок.

Есть два типа бейджей:

- бейдж документа, который отображается во вкладке браузера, рядом с фавиконкой
- бейдж приложения, который отображается в углу иконки на рабочем столе или панели приложений

Для установки достаточно вызвать метод setAppBadge() объекта navigator. Опционально можно передать число, которое будет отображаться в бейдже. Операционная система получает команду и решает, когда стоит отобразить бейдж. В некоторых случаях это может не сработать, это стоит иметь ввиду. Метод clearAppBadge() убирает бейдж.

// Установить бейдж в виде точки
navigator.setAppBadge();

// Установить бейдж с числом 5
navigator.setAppBadge(5);

// Удалить бейдж
navigator.clearAppBadge();


API работает для сайтов, которые устанавливаются как отдельные приложения (PWA). Для использования также нужен HTTPS. Бейджи будут полезны для сайтов, где есть чаты или уведомления.

#js #web_api
MDN Web Docs Badging API - Web APIs | MDN The Badging API gives web developers a method of setting a badge on a document or application, to act as a notification that state has changed without displaying a more distracting notification. A common use case for this would be an application with a messaging…
  • 🔥 20
  • 👍 9
  • ❤ 2
More from @alexnozer_dev
  1. Sep 23, 2026Images Preview На некоторых сайтах, где надо показывать изображения в высоком качестве, дл…
  2. Sep 21, 2026Реализация пользовательских атрибутов Под конец прошлого года я рассказывал об API пользов…
  3. Sep 14, 2026Подклассы Event вместо CustomEvent Многие библиотеки предоставляют систему событий в качес…
  4. Sep 11, 2026Эволюция стилей в темах Shopify Адам Ватан на днях поделился новостью, что Shopify выкупил…
  5. Sep 9, 2026Persistent Widgets Многие сайты не должны быть SPA. Но иногда эта архитектура продиктована…
  6. Sep 7, 2026Processing Instructions и маркеры В DOM всё представлено в виде узлов (Node) разных типов.…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →