Google Chrome Extensions — Часть 1. Архитектура
Что такое Chrome Extension? Это маленькая программа, которая модифицирует и дополняет функциональность браузера Google Chrome. Для создания полноценного расширения вам понадобиться знание HTML, CSS, JavaScript. После написания, файлы пакуются в специальный файл с расширением .crx, который собой являет zip архив. В таком виде пользователь сможет установить расширение. За счет того что этот пакет содержит все необходимые файлы, chrome расширение не зависит от ресурсов из интернета и способен корректно работать даже в оффлайн режиме.
Любое chrome расширение может иметь такую структуру:
может, так как не все эти части есть обязательные, все зависит от конкретных потребностей и особенностей реализации.
Manifest.json
Манифест — главный файл в chrome расширении, поскольку здесь информация о доступах которые нужны, о подключаемых файлах, настройки безопасности и многое другое. Например:
- Manifest_version — Версия манифест файла
- Name — название расширения
- Description — описание расширения
- Version — версия расширения
- Permissions — массив с названиями доступов, которые необходимы для корректной работы расширения, например без пермишина tabs вы не сможете работать с вкладками браузера
- Content_scripts — массив файлов, которые будут подключены как контент скрипты
- Background — описание файла или файлов, которые будут выполнять роль background скрипта и страницы
- Web_accessible_resources — набор файлов, которые имеют открытый доступ извне
- Browser_action — настройка соответствующей кнопки, в тулбаре
- Icons — списки иконок по стандартным размерам 16 48 и 128.
Background page
Если взять определение с официальной документации — невидимая страница, которая содержит основную логику расширения. Главной особенностью background страницы есть то, что она запускается и выполняет некую работу в фоновом режиме, как только запускается браузер и держится в оперативной памяти как фоновый процесс на протяжении сессии. Используя комбинацию Shift + Esc Вы можете просмотреть список задач, которые выполняются внутри браузера Google Chrome. Когда установлено много расширений, список задач этом списке также большой. Они занимают часть памяти и возможно других ресурсов, но не выполняют никаких функций, так как непосредственно само расширение не запущено, а в списке вы видите background страницу конкретного расширения.
Чтобы оптимизировать использование ресурсов, в 2012 году была разработана концепция ивент страниц (Event Pages). Она выполняет те же функции что и бэкграунд страница, но призвана решить проблему производительности и ресурсов, которые используются иррационально. Главное отличие этого подхода — вместо непрерывной работы в фоновом режиме, ивент страница запускается только тогда, когда нужно — например чтобы обработать конкретное событие. После чего выгружается, освобождая память до того момента пока конкретное событие не сработает в следующий раз. В плане кода, разницы никакой между этими двумя подходами нет, а единственное что нужно, указать в manifest.json файле это корректное значение проперти persistent. По умолчанию это значение будет стоять в true для стандартных background страниц и false для ивент страниц.
Это обязательные элементы Chrome Extension-а, теперь давайте перейдем к опциональным.
Content Scripts
Контент скрипты — это javascript файлы или код, которые выполняються не в отдельном фоновом процессе (как бекграунд скрипты) а в контексте Веб страницы. Контент скрипты используют в ограниченном виде Chrome API. Но при этом они изолированные и не могут использовать, как функции и переменные которые объявлены, например на бекграунд странице так и переменные, функции и тд. со скриптов находящихся на веб странице.
Полноценный доступ есть только через к DOM дереву страницы. С контент скрипта вы можете инициировать ивенты, изменять DOM. Даже можете добавлять script тег в страницу и подключать нужные файлы.
Content Security Policy
Для Chrome расширений, действует так называемое Content Security Policy — это набор строгих правил, которые необходимы для того чтобы сделать расширения безопасней и контролировать контент который может быть загружен и выполнен в расширении.
По умолчанию, если использовать манифест 2 версии то в расширении будут такие ограничения:
- Запрещено использовать eval и схожие функции
- Inline джаваскрипт выполняться не будет
- Возможность загружать только локальные скрипты и ресурсы
Эти правила можно отменить или облегчить при необходимости. Например, можно добавить настройки хоста с которого вы хотите извлекать определенные ресурсы или скрипты, но все еще запрещено использовать протокол HTTP только HTTPS.
Также можно разрешить использование eval функции.
Разрешить нельзя использование только инлайн скриптов.
Chrome Javascript API’s
Разрабатывая хром расширения, получить доступ к методам и возможностям браузера можно с помощью специального Chrome Javascript API’s. Большинство методов асинхронные, о чем нужно помнить разрабатывая расширение.
Коммуникация
Так как background страница в другой области видимости чем например контент скрипт который выполняется в контексте веб-страницы, нужен какой то способ коммуникации между Content Scripts и Background scripts.
Эту возможность нам и предоставляет API. Chrome Javascript API вводит концепцию Message Passing с помощью которой и происходит коммуникация. Background страница может подписываться на сообщения которые пришли из content script-а и наоборот, кроме того давать ответ в том же канале. API дает возможность работать с короткими запросами похожими больше на события и долговременными (аналог полинга).
Два описанных метода коммуникации в Chrome расширениях используют для background страниц или отдельных окон расширения с content script-ами и наоборот. Content scripts выполняються в своей песочнице и это вызывает проблему с доступом к странице и области видимости скриптов.
К сожалению Chrome браузер не предоставляет нормальных способов для решения этой проблемы. Непосредственно с контент скрипта, доступиться к функциям или переменной страницы в данный момент невозможно. Но для этого можно использовать Web Accessible Resources.
Как я уже отмечал ранее, с content script-а мы можем модифицировать DOM, а именно создать например новый тег script, в атрибуте src задать ему путь к скрипту который открыт для внешнего использования, и добавить этот тег в DOM.
Таким способом подключать можно только те которые описаны в массиве web_accessible_resources в manifest.json файле.
С использованием такого подхода вы получаете полный доступ к вашей странице, но конечно тут возникают другие проблемы о которых мы поговорим с Вами в другой части этой статьи.
