Web App Manifest

Web App Manifest — это файл в формате JSON, содержащий метаданные о веб-приложении, которые позволяют браузеру отображать его как нативное приложение на устройстве пользователя. Он является ключевым компонентом технологии Progressive Web App (PWA) и определяет такие характеристики, как имя, иконки, цветовую схему, режим отображения и ориентацию экрана. Манифест позволяет веб-сайту быть «устанавливаемым» на домашний экран устройства, предоставляя пользователю доступ к нему без необходимости заходить в браузер.

История и стандартизация

Технология Web App Manifest была разработана консорциумом W3C (World Wide Web Consortium) в рамках инициативы по созданию прогрессивных веб-приложений. Первая рабочая версия спецификации была опубликована в 2013 году. Активная работа над стандартом велась параллельно с развитием Service Workers — другого ключевого компонента PWA. В 2017 году черновик стал рекомендованным стандартом W3C (Recommendation). С тех пор спецификация регулярно обновляется, добавляя новые возможности, такие как поддержка обработчиков файлов (File Handling), ярлыков (Shortcuts) и протоколов (Protocol Handlers). Основные браузеры (Google Chrome, Mozilla Firefox, Apple Safari, Microsoft Edge) поддерживают манифест, хотя степень реализации отдельных функций может различаться.

Структура и основные поля

Файл манифеста обычно имеет имя manifest.json и подключается к HTML-странице через элемент <link rel="manifest" href="/manifest.json">. Основные поля манифеста:

• name (строка) — полное имя приложения, отображаемое пользователю (например, на экране установки или в списке приложений). Обязательное поле.
• short_name (строка) — сокращённое имя, используемое, когда места для полного имени недостаточно (например, под иконкой на домашнем экране).
• description (строка) — краткое описание приложения, которое может отображаться в диалогах установки.
• start_url (строка) — URL-адрес, который загружается при запуске приложения. Может быть относительным или абсолютным.
• display (строка) — определяет режим отображения приложения:
• fullscreen — приложение занимает весь экран, скрывая все элементы интерфейса браузера (адресную строку, панель навигации).
• standalone — приложение выглядит как отдельное окно, похожее на нативное приложение, с собственным заголовком и кнопками управления (закрыть, свернуть).
• minimal-ui — приложение отображается с минимальным набором элементов управления браузера (например, только кнопка «Назад»).
• browser — стандартный режим браузера с полной панелью навигации.
• orientation (строка) — задаёт предпочтительную ориентацию экрана: any, natural, landscape, portrait, portrait-primary, landscape-primary и другие.
• icons (массив объектов) — список иконок приложения для разных размеров и плотностей пикселей. Каждый объект содержит поля src (URL иконки), sizes (размеры, например, 192x192), type (MIME-тип, например, image/png). Рекомендуется включать иконки размером 192x192 и 512x512 пикселей.
• background_color (строка) — цвет фона экрана загрузки (splash screen), который отображается до момента загрузки приложения.
• theme_color (строка) — цвет темы приложения, используемый для окрашивания панели инструментов браузера (например, адресной строки в Chrome на Android).
• scope (строка) — определяет область действия манифеста. Страницы, находящиеся вне этого URL, не будут считаться частью приложения. Если поле не указано, областью считается директория, в которой находится манифест.
• categories (массив строк) — категории приложения (например, business, education, games). Поле носит рекомендательный характер.
• screenshots (массив объектов) — скриншоты приложения, используемые в магазинах приложений или при установке.
• shortcuts (массив объектов) — ярлыки для быстрого доступа к определённым функциям или страницам приложения (появилось в Chrome 84).
• handle_links (строка) — определяет, как приложение обрабатывает ссылки: auto, preferred, not-preferred.
• file_handlers (массив объектов) — позволяет приложению обрабатывать файлы определённых типов (например, изображения или текстовые документы).

Пример манифеста

``json { "name": "Моё приложение", "short_name": "Моё прил.", "description": "Простое веб-приложение для заметок", "start_url": "/", "display": "standalone", "background_color": "#ffffff", "theme_color": "#3367D6", "icons": [ { "src": "/icons/icon-192x192.png", "sizes": "192x192", "type": "image/png" }, { "src": "/icons/icon-512x512.png", "sizes": "512x512", "type": "image/png" } ], "scope": "/", "categories": ["productivity", "utilities"] } ``

Значение для PWA

Web App Manifest является обязательным элементом для создания прогрессивного веб-приложения (PWA). Без него браузер не сможет предложить пользователю установить сайт на устройство. Манифест превращает обычный веб-сайт в приложение, которое:

• Устанавливается на домашний экран — пользователь добавляет иконку на рабочий стол или в меню приложений.
• Запускается в собственном окне — без элементов интерфейса браузера, что создаёт ощущение работы с нативным приложением.
• Имеет собственный значок и имя — отображается в списке установленных приложений.
• Поддерживает офлайн-режим — в сочетании с Service Worker позволяет загружать контент без доступа к сети.
• Может получать push-уведомления — при наличии соответствующего разрешения пользователя.

Поддержка браузерами

По состоянию на 2024 год Web App Manifest поддерживается всеми основными браузерами, однако существуют различия в реализации:

• Google Chrome (Android, Windows, macOS, Linux) — полная поддержка, включая установку, автономный режим, ярлыки и обработчики файлов.
• Mozilla Firefox (Android) — поддерживает установку и автономный режим. На десктопе Firefox не предлагает установку PWA, но может отображать манифест.
• Apple Safari (iOS, iPadOS) — поддерживает манифест с iOS 11.3, но не все функции реализованы (например, отсутствует поддержка shortcuts и file_handlers). Установка на домашний экран работает, но приложение не получает полноценного автономного окна.
• Microsoft Edge (Windows, Android) — полная поддержка, аналогичная Chrome. Edge также позволяет устанавливать PWA из магазина Microsoft Store.

Критика и ограничения

Несмотря на широкое распространение, технология Web App Manifest имеет ряд ограничений:

• Отсутствие доступа к некоторым API — веб-приложения не могут использовать все возможности нативных приложений, такие как Bluetooth, NFC, доступ к файловой системе в полном объёме (хотя некоторые API постепенно добавляются).
• Зависимость от браузера — установленное PWA может быть удалено при очистке данных браузера или смене устройства.
• Ограниченная поддержка на iOS — Safari не предоставляет PWA тех же возможностей, что Chrome на Android (например, отсутствие push-уведомлений и полноценного офлайн-режима).
• Сложности с обновлением — обновление манифеста не всегда автоматически применяется к уже установленным приложениям.
• Проблемы с безопасностью — манифест может быть использован для фишинга, если злоумышленник создаёт поддельное приложение с именем, похожим на известный сервис.

Будущее развитие

Спецификация Web App Manifest продолжает развиваться. В планах W3C — расширение функциональности, включая поддержку:

• Badging API — отображение значков с уведомлениями на иконке приложения.
• App Shortcuts — контекстное меню при долгом нажатии на иконку.
• File System Access API — прямой доступ к файловой системе устройства.
• Web Share Target — возможность принимать файлы и ссылки от других приложений.
• Multi-screen support — работа на нескольких мониторах.

Эти нововведения направлены на сокращение разрыва между веб- и нативными приложениями, делая PWA более конкурентоспособными.

Источники

• W3C Web App Manifest Specification
• MDN Web Docs: Web App Manifest
• Google Developers: Progressive Web Apps
• Apple Developer Documentation: Safari Web App Manifest
• Microsoft Edge Developer Documentation: Progressive Web Apps