Pull to refresh

Рецепт быстрого приготовления расширений под популярные браузеры

Reading time 2 min
Views 1.2K
0147 (1)

Возникла задача написание простенького расширения под все (по возможности) популярные браузеры. Деятельность расширения заключается во внедрении javascript`а в тело документа.

Доктор прописал инъекции javascript`а


Казалось бы все просто, выполняем в строке браузера код:

  1. javascript: var s = document.createElement('script');
  2. s.type='text/javascript';
  3. document.body.appendChild(s);
  4. s.src='script.js';
  5. void(0);
Но что делать если ваш скрипт должен обрабатывать все страницы чужого сайта. Не заставлять же пользователя постоянно click`ать по закладке с кодом инъекции после каждого перехода на новую страницу. Наивные поиски простого решения не увенчались успехом:
  • Это был перехват всех ссылок на страничке и добавление своего кода «javascript:”, разумеется код выполнялся в рамках открытой страницы и потом переходил на новую «чистую” страницу через (location.href).
  • Вариант с setTimeout был вообще в порядке бреда… выполение отваливалось после начала загрузки новой страницы.
Написание расширений под множество браузеров меня пугала больше всего, но что делать, начал вспоминать наиболее популярные:
  • IE 7+ (на 6-ку решил просто забить, много затрат ради небольшой аудитории пользователей – уж простите меня)
  • Firefox 1.5+
  • Chrome 4+
  • Opera 9+ (в итоге оказалось extension`ы можно писать только под Opera 11)
  • Safari 3+
«С Firefox и Chrome проблем не должно возникнуть” – подумал я.

Google Chrome


За час был написал extension для Chrome – масса документации на официальном сайте, масса примеров. В общем рай для разработчика.

Примеры и Руководство

фрагмент из background.html

  1. function onRequest(tabId, changeInfo, tab) {
  2.         if (changeInfo.status == 'complete'){
  3.                 chrome.tabs.executeScript(tabId, { code:"код без javascript:" });
  4.         };
  5. };
  6. chrome.tabs.onUpdated.addListener(onRequest);

Все получилось просто и со вкусом. Напрямую вставить в тело документа 
Tags:
Hubs:
+70
Comments 51
Comments Comments 51

Articles