Расширения Chrome
Судя по всему это отмирающий инструмент. В новой документации разработчика, они не входят в “Основы” и вообще отошли на второй план. Новая парадигма – использование страниц типа Event. Гугл рекомендует использовать именно их.
Что же это такое Background Pages:
Расширению часто требуется общий для всех вкладок скрипт, который обеспечивает их взаимодействие, хранит состояние. В конце концов, объединяет в одном месте весь используемый код, вместо того чтобы загружать его для каждой вкладки индивидуально.
Фоновая страница – это невидимая страница, которая как раз и содержит такой скрипт. Их бывает два типа: persistent (постоянные) и event (управляемые событиями). Persistent, как можно догадаться, загружена постоянно, а event-страница загружается только при необходимости, когда возникает связанное с ней событие.
Когда в документации упоминается background page, то речь обычно идет о persistent background page. А Event background page называют просто event page. Ниже речь пойдет про постоянные страницы.
Примечание:
для режима “инкогнито” может быть создана своя копия фоновой страницы, в зависимости от некоторых настроек.
Для взаимодействие между отдельными страницами можно использовать прямые вызовы скриптов, как это делается при взаимодействии фреймов. Метод extension.getViews возвращает список всех открытых окон для каждой страницы где активно ваше расширение, а метод extension.getBackgroundPage позволяет обратиться к фоновой странице.
Манифест
В общем случае фоновая страница не содержит никакой HTML-разметки. Зачем? Она же невидимая. Поэтому в манифесте мы указываем только скрипты которые нужно на нее загрузить, а пустой документ браузер создает автоматически.
Но можно загрузить и HTML. Например разместить там какие-то шаблоны, ну или просто вам так привычнее.
В некоторых случаях еще нужно указать «background» permission. Это приведет к тому что ваш браузер будет загружен постоянно, в фоновом режиме. Он загрузится сразу после включения компьютера и останется в памяти даже если вы закрыли все окна. Это необходимо, например, для вывода уведомлений.
Когда и зачем мне нужны background.html или background.js?
Я строю свое первое расширение Chrome. Я просмотрел документацию для разработчиков Chrome, но не смог понять несколько тем.
Есть два действия:
- Действие браузера (кнопка вне адресной строки)
- действие на странице (кнопка в адресной строке)
Для обоих действий у нас есть фоновые страницы :
- Фоновые страницы могут быть background.html или background.js для действий браузера
- Или background.html или eventPage.js для действий на странице
Я использую действие страницы. Для всплывающей страницы по умолчанию я использовал popup.html .
Теперь, где это background.html и eventPage.js подходят (особенно background.html , поскольку у меня уже есть popup.html , мне это нужно?)
Что должен eventPage.js иметь? Что должен background.html иметь?
2 ответа
В вашей manifest.json , если вы используете «страницу события» (рекомендуется уменьшите использование памяти вашего расширения) у вас будет что-то вроде
Теперь вышеприведенный манифест на самом деле не будет работать: вы можете иметь только один из «scripts» или «page» ключа в словаре «background» . Самое простое, что можно сделать, это определить «scripts» . Затем вы можете написать кучу javascript и запустить его в ответ на различные события, такие как chrome. runtime.onMessage и chrome.pageAction.onClicked.
Javascript, который вы перечисляете в ключе «scripts» , работает в контексте документа HTML и может использовать API-интерфейсы DOM, такие как document.createElement () во время работы. По умолчанию Chrome генерирует документ в форме:
Держать сценарии, которые вы перечисляете. Вы увидите это в chrome: // extensions /, если щелкнуть ссылку «фоновая страница» рядом с «Проверять представления». Однако иногда вы можете захотеть, чтобы в этом документе было больше предопределенных элементов. Я видел такие примеры:
Поэтому event.js может использовать document.getElementById(‘the_canvas’) для извлечения холста, на котором он может рисовать. Без пользовательского документа ваш javascript мог бы работать:
И получить тот же результат, но документ может быть проще. Этот HTML-файл — это то, что вы поместите в ключ background.page в своем манифесте.
Как уже упоминалось в @SirDemon, иногда вы вообще можете обойтись без фоновой страницы / страницы событий, если поместите все в действие браузера. Поскольку действие страницы должно отображаться только для страниц, к которым оно имеет отношение, обычно вам потребуется фон / страница события для управления действием страницы.
Вам не обязательно нужен фоновая страница или фоновый скрипт. Если вы намереваетесь создать расширение, которое не требует взаимодействия с человеком, тогда вам понадобятся .
Действия на странице и в браузере обычно означают, что вы намереваетесь иметь какой-то пользовательский интерфейс, поэтому нет необходимости в фоновых материалах. Просто добавьте свои скрипты и т. Д. На свою главную html-страницу default_popup, как обычно.
ключ background
Используйте ключ background для включения одного или нескольких фоновых сценариев и, возможно, фоновой страницы в ваше расширение.
Фоновые сценарии — это место для размещения кода, который должен поддерживать долгосрочное состояние или выполнять долгосрочные операции, независимо от времени жизни каких-либо конкретных веб-страниц или окон браузера.
Фоновые сценарии загружаются сразу при загрузке расширения и остаются загруженными до тех пор, пока расширение не будет отключено или удалено. Вы можете использовать любой API-интерфейс WebExtension в сценарии, если вы запросили необходимые права (permissions).
Дополнительную информацию см. В разделе «Справочные страницы» в статье Анатомия расширения.
Ключ background это объект, у которого есть два следующих необязательных свойства:
Массив строк, каждая из которых представляет собой путь к файлу JavaScript. Путь к этим файлам указывают относительно папки, в которой находится файл manifest.json. Это скрипты, которые будут выполняться в фоновой странице расширения.
У этих скриптов общий глобальный контекст объекта window .
Скрипты загружаются в том порядке, в котором они указаны в массиве.
Если вы указали значения с помощью свойства scripts , будет создана пустая фоновая страница, в которой будут работать все эти скрипты.
Примечание: Если вы хотите добавить скрипт из удалённого расположения с помощью тега <script> (например, <script src = «https://code.jquery.com/jquery-1.7.1.min.js»> ), может также понадобиться изменить значение ключа content_security_policy в файле manifest.json вашего расширения.
Примечание: В Firefox до версии 50, когда открыт отладчик, скрипты не всегда загружаются в том порядке, в котором они расположены в массиве. Чтобы обойти этот баг, можно использовать свойство page (вместо scripts ) и добавить фоновые скрипты с помощью тегов <script> в странице HTML. Этот баг починен в Firefox 50. Начиная с этой версии, скрипты всегда загружаются в том порядке, в котором они следуют в массиве.
Если вам нужно какое-нибудь содержимое HTML-страницы, можно определить свою фоновую страницу с помощью свойства page . Это строка, которая представляет собой путь к файлу документа HTML, заданный относительно расположения файла manifest.json. Этот файл HTML должен находиться внутри вашего расширения.
Если используется это свойство, то уже нельзя добавлять скрипты с помощью свойства scripts . Вместо этого нужно добавлять скрипты в страницу — точно таким же образом, как в обычную веб-страницу.