Файл manifest json что это
Русские Блоги
Интерпретация файла манифеста разработки плагина браузера
Интерпретация файла манифеста разработки плагина браузера
Данные исследований
инструкции по настройке manifest.json
manifest.json используется для описания исходных данных и информации о конфигурации подключаемого модуля Chrome. Основное содержимое выглядит следующим образом
Введение в элементы конфигурации
1. manifest_version необходимые
Версия формата файла манифеста, написанная Chrome 18 2 Жестяная банка
2. name необходимые
3. version необходимые
Версия подключаемого модуля. После выпуска новой версии браузер сравнит версию установленного подключаемого модуля, и, если есть более новая версия, он автоматически обновится.
4. description
Описание плагина, не более 132 символов
5. icons
Значок плагина может отображаться в магазине Chrome (128 * 128) | Интерфейс управления плагином (48 * 48) | Значок страницы расширения (16 * 16) желательно в формате png
6. browser_action
7. page_action
Представляет операции, которые могут быть выполнены на текущей странице, затемненные в неактивном состоянии, соответствующие интерфейсу. chrome.pageAction
browser_action с участием page_action Оба используются для определения ситуации щелчка значка, размещенного в верхнем правом углу панели инструментов, но отображение состояния активности двух | Отображение после щелчка | В основном отвечает за несогласованность сцены
Официальное предложение: если реализуемая функция полезна только для определенной страницы, рекомендуется использовать page_action В противном случае используйте browser_action
8. background
Используется для определения части фонового скрипта
В следующих ситуациях потребуется вызвать фоновый скрипт
Параметры определения фонового скрипта
Фильтр событий, некоторые события поддерживают фильтр событий, например, можно отслеживать переключение вкладок
9. Изменение настроек хрома | Изменение отображения пользовательского интерфейса в Chrome | Замена некоторых встроенных страниц в Chrome
10. commands
в состоянии пройти commands Возможность определения сочетаний клавиш для запуска расширенных событий
После нажатия сочетания клавиш серверная часть подключаемого модуля будет отслеживать соответствующее событие.
нота: \ _execute_browser_action \ _execute_page_action Эти две команды не будут отслеживаться. Они вызывают всплывающее окно. Чтобы отслеживать событие всплывающего окна, вы можете использовать popup_page onDomReady
11. content_scripts
content_script Работая в специальной среде, ее можно назвать изолированной средой, в которой вы можете получить доступ к DOM внедренной страницы, но не можете получить доступ к каким-либо переменным и функциям javascript внутри. Напротив, js на странице также недоступны content_script Переменные и функции в
Посетите DOM целевого веб-сайта, который можно использовать для связи
Случай связи, поделитесь DOM со страницей через content_script, чтобы реализовать связь между страницей и расширением
12. externally_connectable
Эта конфигурация напрямую реализует связь между веб-сайтом и плагином, но в manifest.json необходимо выполнить следующую конфигурацию.
13. offline_enabled
Независимо от того, должно ли расширение работать в автономном режиме, по умолчанию установлено значение true, когда хром обнаруживает автономный режим, программа будет выделена
14. permissions | optional_permissions
Объявите разрешения (необходимые подключаемому модулю для реализации основных функций) | Дополнительные разрешения (необходимые дополнительным функциям в подключаемом модуле), элементы подконфигурации этих двух одинаковые
15. web_accessible_resources
Укажите массив строк пути упакованных ресурсов, эти ресурсы доступны в расширении, например content_script Ресурсы, которые будут использоваться и т. Д.,
16. content_security_policy
Политика безопасности контента, политика безопасности по умолчанию script-src ‘self’; object-src ‘self’ У него будут следующие ограничения
Интеллектуальная рекомендация
Совместное использование сухих товаров GitHub (высокая степень интеграции страницы руководства APP-DHGuidePageHUD)
Каждое приложение будет использовать страницу руководства APP, которая не важна, но обязательна. Будь то первая установка приложения или обновление версии, это единственное, что будет показано пользов.
Организуйте некоторые элементы управления диаграммами, которые можно использовать в веб-разработке, в основном для клиентских реализаций, таких как Flash, JavaScript, Silverlight; если для создания ст.
Некоторые методы конфигурации Django_redis и сельдерея
Problem for Nazar
Vue следит за тем, чтобы браузер возвращал
Пишем правильный манифест для сайта
Думаю, многие знают о возможности добавления иконки сайта на рабочий стол мобильного устройства. Это удобно и причины могут быть разные (нету мобильного приложения, предоставляющего туже информацию, либо вы хотите сразу открыть определенную страницу сайта и т.д.). За некоторые свойства того, как будет отображаться сайт и как будет выглядеть иконка после добавления и отвечает файл манифеста.
Манифест для сайта – это простой JSON-файл, который позволяет вам настроить следующие вещи:
1. Какая будет иконка у пользователя, после того как он добавит ваш сайт на рабочий стол
2. Как будет запускаться ваш сайт (с адресной строкой, без нее или в полноэкранном режиме)
3. Splash screen
4. Цветовую тему
5. Ориентацию экрана
6. Начальный url
и многое другое
Подробнее
Чтобы показать, как manifest влияет на отображение сайта, я создал простое, тестовое веб-приложение, которые возвращает название региона по коду.
Сначала зафиксируем положение дел до добавления файла манифеста. 
После того как пользователь добавил иконку, она будет выглядеть так (на Андроид 5.0)
Название браузер выдернул из тега tilte. Так что, если у вас нету файла манифеста, то хотя бы title должен быть нормальным. А вот иконка в виде буквы “G” появилась сама (не понятно, почему именно G).
А сам сайт будет выглядеть так
Тут, собственно, ничего особенного, кроме того, что мы можем убрать адресную строку, чтобы приложение было похоже на нативное.
Встречайте, manifest.json!
Генерируй и властвуй.
Конечно, можно написать весь манифест ручками, но это скучно, долго и можно ошибиться. Уже нашлось немало умельцев, которые автоматизировали этот процесс. Ниже небольшой обзор инструментов для автоматической генерации манифеста.
brucelawson.github.io/manifest — все что вам нужно – заполнить поля (есть краткое описание каждого параметра, так что процесс довольно легкий), остальное за вас сделает генератор.
www.favicon-generator.org — хоть прямое назначение этого сайта генерировать иконки, а не манифест. Он все же его создает и в отличии от предыдущего у вас уже будут и иконки (для iOS и Аднроид) и манифест. Правда, манифест придется подправить (изменить имя и прочее настройки).
manifest-validator.appspot.com — этот инструмент предназначен для валидации вашего манифеста.
Результат
Итак иконки нарисовали, манифест сделали. Дальше надо сообщить браузеру о манифесте, добавив в тег head следующие
Все. Смотрим, что получилось
Иконка:
Слева до. Справа после (иконка получилась невпечатлительная, с удовольствием поменяю, если пришлете лучше). Тут уже заметно, что Android использовал имя из поля short_name, так как name не помещается, видимо.
Загрузка приложения: 
Тут самые приятные изменения. Во-первых, вместо белого экрана вы видите подобие splash screen, который сам создается системой из иконки, полного имени и цвета, указанного в манифесте (возможно, это происходит только на android 5.0 выше). Во-вторых, этот splash screen плавно исчезает, что визуально красиво.
Сам сайт: 
Тут тоже все стало лаконично. Без UI браузера сайт смотрится гораздо лучше и больше похож на нативное приложение.
Я перечислил не все свойства, которые можно указать в файле манифеста. С полным списком можно ознакомиться здесь
Демо приложение
Репозиторий приложения
Также необходимо подчеркнуть, что все это не будет работать на яблочных устройствах. На них можно достичь приблизительно такого результата, только надо использовать другой способ.
Манифест? А? Что? Зачем?
Многие из нас, кто работает над вебом, активно стараются уменьшить разрыв между нативными и веб-приложениями.
Но что это за разрыв? Всего несколько лет назад этот разрыв был, в большей степени, технологическим. Если вы хотели получить доступ к GPS устройства, вам приходилось писать нативное приложение. Сейчас ситуация несколько улучшилась: теперь мы можем получать доступ к датчикам устройства, вроде GPS, камеры и ориентации устройства — хотя впереди ещё долгий путь. Благодаря последним успехам веб-технологий, теперь у нас есть платформа, которая может конкурировать с нативными приложениями уже почти на равных.
Сегодня разрыв между нативными и веб-приложениями не столько технологический — дело в удобстве пользователей: они предпочитают устанавливать приложения, которые уютно живут на домашнем экране (или даже на рабочем столе, если речь про десктопные браузеры).
Кроме того, нативные приложения по умолчанию работают в офлайне и интегрируются с возможностями, которые предоставляет операционная система: например, возможность видеть установленные приложения в переключателе задач. Или возможность управлять настройками конфиденциальности приложения в том же самом месте, что и для приложений, установленных из магазина. Чтобы сделать что-нибудь подобное в браузере, мы всё ещё слоняемся по браузеру в поисках открытых вкладок и вводим длинные, скучные адреса.
Нам нужен такой способ «установки» веб-приложений, чтобы они были неотличимы от любого другого приложения, установленного на устройстве пользователя. Но в тоже время, мы не хотим потерять мощные функции, составляющие основу веб-платформы: связанность ссылками, просмотр исходного кода и возможность хостить собственные проекты.
Мы в веб-сообществе, как правило, называем это «прогрессивными веб-приложениями».
Что такое «установка»?
По сути, «установка» веб-приложения — это добавление «закладки» на домашний экран или в программу запуска приложений. Есть некоторые довольно очевидные вещи, которые вы, как разработчик, должны предоставить браузеру, чтобы тот мог считать сайт приложением: название, иконки, и т.д. Есть и более сложные функции, которые могут вам пригодиться, например, возможность указать предпочтительную ориентацию устройства и нужен ли вам полноэкранный режим.
Спецификация манифеста предлагает вам стандартный способ сделать это с помощью файла JSON. Просто сошлитесь на файл манифеста в HTML-странице следующим образом:
Но что находится в этом загадочном файле манифеста? Хорошо, что вы спросили!
Очень простой манифест
Самый простой манифест может состоять всего-то из имени и одной или нескольких иконок.
Типичный манифест
Более типичный манифест может выглядеть следующим образом. Имена его ключей должны говорить сами за себя, но мы подробнее опишем их использование ниже.
Название приложения
Ключ short_name служит названием приложения при отображении в условиях ограниченного пространства (например, под значком на домашнем экране телефона). Ключ name может быть немного длиннее, отображая название приложения полностью. Также он служит дополнительной информацией для пользователя, который ищет ваше приложения на телефоне. Так что, набрав «улётный» или «фото», пользователь сможет найти приложение на своем устройстве.
Но будьте внимательны: некоторые браузеры могут требовать указать название — иначе, ваше приложение может лишиться статуса «прогрессивное веб-приложение».
Иконки
Назначение иконки
Больше подробностей о назначении иконок можно найти в спецификации Web App Manifest.
Режимы отображения и ориентация
Приложения при запуске должны иметь возможность контролировать свое отображение на экране. Если это игра, то ей, вероятно, нужно быть в полноэкранном режиме и в горизонтальной ориентации. Для этого формат манифеста предоставляет вам два ключа.
Доступные значения режимов отображения:
Плюс такого указания ориентации в том, что она выступает в качестве «ориентации по умолчанию» для всего приложения. Поэтому, при переходе от одной странице к другой, ваше приложение остается в правильном положении. Вы можете изменить ориентацию по умолчанию с помощью API ориентации экрана.
Также вы можете применить другие стили для приложение в определённом режиме с помощью характеристики display-mode :
Стартовый адрес
Иногда при запуске приложения вам нужно, чтобы пользователь всегда попадал на определенную страницу. Ключ start_url даёт возможность это указать.
«Область» приложения
Нативные приложения имеют чёткие границы: как пользователь, вы уверены, что когда вы открываете нативное приложение, оно неожиданно не откроет другое незаметно для вас. Чаще всего, вам предельно ясно, что вы переключились с одного нативного приложения на другое. Обычно эти визуальные подсказки предоставляет операционная система (например, вызов диспетчера задач и выбор другого приложения или нажатие Cmd Tab или Alt Tab на компьютере).
С вебом все иначе: это огромная гипертекстовая система, в которой веб-приложение может охватывать несколько доменов: вы можете с легкостью перейти с gmail.com на docs.google.com и пользователь даже этого не заметит. На практике, идея существования границ приложения является абсолютно чуждой для веба. Ведь, в действительности, веб-приложение — это просто серия HTML-документов (представьте «серию труб»… м-м, нет, забудьте!).
В интернете мы знаем, что покидаем область одного приложения и переходим в другое, только благодаря веб-дизайнерам, которые были достаточно добры, чтобы сделать им уникальный различимый дизайн. В случаях, когда это не так, множество пользователей оказываются обмануты сайтами, маскирующимися под другие (старый добрый фишинг).
Формат манифеста решает эту проблему позволяя указывать «область адреса» для вашего приложения. Эта область устанавливает границы для приложения. Это может быть либо домен, либо директория на этом домене.
Интернационализация: lang и dir
Распространение приложения
Нужно написать с подробностями и скриншотами.
Цвет темы и цвет фона
Как мне определить, что пользователь «установил» приложение?
Однако по причинам конфиденциальности вы не можете непосредственно обнаружить, установлено ли ваше приложение — только узнать, что в вашем веб-приложении используется файл манифеста.
Причины для использования отдельного файла:
В спецификации есть более подробная информация о том, почему мы выбрали JSON вместо HTML-тегов.
Кто это внедряет?
Манифест и прогрессивные веб-приложения реализованы в Chrome, Opera и Samsung Internet для Android. Firefox также подаёт обнадёживающие сигналы, что будет поддерживать эти стандарты (реализации в Gecko уже больше двух лет, но она не используется ни в одном из продуктов).
Взаимодействие с поисковыми роботами
Как и другие веб-ресурсы, манифест веб-приложения должен быть доступен для любого веб-браузера или поискового робота.
Если разработчик веб-приложения хочет известить поисковых роботов о запрете на сканирование файла, он может сделать это включив манифест веб-приложения в файл robots.txt. Это описано подробнее в протоколе robots.txt. Разработчик веб-приложения также может использовать HTTP-заголовок X-Robots-Tag.
Авторы
Основная часть этого пояснения первоначально появилась в статье « The W3C App Manifest specification» на HTML5 Doctor, и была написана Маркусом Касересом и Брюсом Лоусоном. Данный материал публикуется на основе лицензии для некоммерческое использования. Вы можете спокойно изменять, повторно использовать, модифицировать и расширять это пояснение. Некоторые авторы сохраняют свои авторские права на отдельные статьи.
Манифест? А? Что? Зачем?
Многие из нас, кто работает над вебом, активно стараются уменьшить разрыв между нативными и веб-приложениями.
Но что это за разрыв? Всего несколько лет назад этот разрыв был, в большей степени, технологическим. Если вы хотели получить доступ к GPS устройства, вам приходилось писать нативное приложение. Сейчас ситуация несколько улучшилась: теперь мы можем получать доступ к датчикам устройства, вроде GPS, камеры и ориентации устройства — хотя впереди ещё долгий путь. Благодаря последним успехам веб-технологий, теперь у нас есть платформа, которая может конкурировать с нативными приложениями уже почти на равных.
Сегодня разрыв между нативными и веб-приложениями не столько технологический — дело в удобстве пользователей: они предпочитают устанавливать приложения, которые уютно живут на домашнем экране (или даже на рабочем столе, если речь про десктопные браузеры).
Кроме того, нативные приложения по умолчанию работают в офлайне и интегрируются с возможностями, которые предоставляет операционная система: например, возможность видеть установленные приложения в переключателе задач. Или возможность управлять настройками конфиденциальности приложения в том же самом месте, что и для приложений, установленных из магазина. Чтобы сделать что-нибудь подобное в браузере, мы всё ещё слоняемся по браузеру в поисках открытых вкладок и вводим длинные, скучные адреса.
Нам нужен такой способ «установки» веб-приложений, чтобы они были неотличимы от любого другого приложения, установленного на устройстве пользователя. Но в тоже время, мы не хотим потерять мощные функции, составляющие основу веб-платформы: связанность ссылками, просмотр исходного кода и возможность хостить собственные проекты.
Мы в веб-сообществе, как правило, называем это «прогрессивными веб-приложениями».
Что такое «установка»? Скопировать ссылку
По сути, «установка» веб-приложения — это добавление «закладки» на домашний экран или в программу запуска приложений. Есть некоторые довольно очевидные вещи, которые вы, как разработчик, должны предоставить браузеру, чтобы тот мог считать сайт приложением: название, иконки, и т.д. Есть и более сложные функции, которые могут вам пригодиться, например, возможность указать предпочтительную ориентацию устройства и нужен ли вам полноэкранный режим.
Спецификация манифеста предлагает вам стандартный способ сделать это с помощью файла JSON. Просто сошлитесь на файл манифеста в HTML-странице следующим образом:
Но что находится в этом загадочном файле манифеста? Хорошо, что вы спросили!
Очень простой манифест Скопировать ссылку
Самый простой манифест может состоять всего-то из имени и одной или нескольких иконок.
Типичный манифест Скопировать ссылку
Более типичный манифест может выглядеть следующим образом. Имена его ключей должны говорить сами за себя, но мы подробнее опишем их использование ниже.
Название приложения Скопировать ссылку
Ключ short_name служит названием приложения при отображении в условиях ограниченного пространства (например, под значком на домашнем экране телефона). Ключ name может быть немного длиннее, отображая название приложения полностью. Также он служит дополнительной информацией для пользователя, который ищет ваше приложения на телефоне. Так что, набрав «улётный» или «фото», пользователь сможет найти приложение на своем устройстве.
Но будьте внимательны: некоторые браузеры могут требовать указать название — иначе, ваше приложение может лишиться статуса «прогрессивное веб-приложение».
Иконки Скопировать ссылку
Назначение иконки Скопировать ссылку
Больше подробностей о назначении иконок можно найти в спецификации Web App Manifest.
Режимы отображения и ориентация Скопировать ссылку
Приложения при запуске должны иметь возможность контролировать свое отображение на экране. Если это игра, то ей, вероятно, нужно быть в полноэкранном режиме и в горизонтальной ориентации. Для этого формат манифеста предоставляет вам два ключа.
Доступные значения режимов отображения:
Плюс такого указания ориентации в том, что она выступает в качестве «ориентации по умолчанию» для всего приложения. Поэтому, при переходе от одной странице к другой, ваше приложение остается в правильном положении. Вы можете изменить ориентацию по умолчанию с помощью API ориентации экрана.
Также вы можете применить другие стили для приложение в определённом режиме с помощью характеристики display-mode :
Стартовый адрес Скопировать ссылку
Иногда при запуске приложения вам нужно, чтобы пользователь всегда попадал на определенную страницу. Ключ start_url даёт возможность это указать.
«Область» приложения Скопировать ссылку
Нативные приложения имеют чёткие границы: как пользователь, вы уверены, что когда вы открываете нативное приложение, оно неожиданно не откроет другое незаметно для вас. Чаще всего, вам предельно ясно, что вы переключились с одного нативного приложения на другое. Обычно эти визуальные подсказки предоставляет операционная система (например, вызов диспетчера задач и выбор другого приложения или нажатие Cmd Tab или Alt Tab на компьютере).
С вебом все иначе: это огромная гипертекстовая система, в которой веб-приложение может охватывать несколько доменов: вы можете с легкостью перейти с gmail.com на docs.google.com и пользователь даже этого не заметит. На практике, идея существования границ приложения является абсолютно чуждой для веба. Ведь, в действительности, веб-приложение — это просто серия HTML-документов (представьте «серию труб»… м-м, нет, забудьте!).
В интернете мы знаем, что покидаем область одного приложения и переходим в другое, только благодаря веб-дизайнерам, которые были достаточно добры, чтобы сделать им уникальный различимый дизайн. В случаях, когда это не так, множество пользователей оказываются обмануты сайтами, маскирующимися под другие (старый добрый фишинг).
Формат манифеста решает эту проблему позволяя указывать «область адреса» для вашего приложения. Эта область устанавливает границы для приложения. Это может быть либо домен, либо директория на этом домене.
Интернационализация: lang и dir Скопировать ссылку
Распространение приложения Скопировать ссылку
Нужно написать с подробностями и скриншотами.
Цвет темы и цвет фона Скопировать ссылку
Как мне определить, что пользователь «установил» приложение? Скопировать ссылку
Однако по причинам конфиденциальности вы не можете непосредственно обнаружить, установлено ли ваше приложение — только узнать, что в вашем веб-приложении используется файл манифеста.
Причины для использования отдельного файла:
В спецификации есть более подробная информация о том, почему мы выбрали JSON вместо HTML-тегов.
Кто это внедряет? Скопировать ссылку
Манифест и прогрессивные веб-приложения реализованы в Chrome, Opera и Samsung Internet для Android. Firefox также подаёт обнадёживающие сигналы, что будет поддерживать эти стандарты (реализации в Gecko уже больше двух лет, но она не используется ни в одном из продуктов).
Взаимодействие с поисковыми роботами Скопировать ссылку
Как и другие веб-ресурсы, манифест веб-приложения должен быть доступен для любого веб-браузера или поискового робота.
Авторы Скопировать ссылку
Основная часть этого пояснения первоначально появилась в статье «The W3C App Manifest specification» на HTML5 Doctor, и была написана Маркусом Касересом и Брюсом Лоусоном. Данный материал публикуется на основе лицензии для некоммерческое использования. Вы можете спокойно изменять, повторно использовать, модифицировать и расширять это пояснение. Некоторые авторы сохраняют свои авторские права на отдельные статьи.