Как посмотреть исходный код любого расширения в браузере
Всем привет, многие из вас используют расширения для браузеров, начиная от Google Chrome и заканчивая на Opera и Mozila Firefox. Все расширения, которые вы устанавливаете требуют тех или иных разрешений, таких как изменение информации на страницах, редактирование данных и многое другое. Некоторых такие пункты сильно смущают тем, что они не могут наверняка знать, а не злоупотребляет ли расширение такими правами. Именно поэтому было создано другое расширение для браузера, которое поможет увидеть исходный код расширения и узнать куда оно тратит предоставленные ему права, либо поможет вам создать свое расширение на базе полученных исходников.
Приступаем:
1) Заходим на страницу расширения и устанавливаем его
![]()
2) Нажимаем на значок расширения и выбираем пункт «View Extension Sourse»

3) Вставляем ссылку на расширение, которое хотим проинспектировать
![]()
4) Жмем «Open in this viewer»

5) Выбираем необходимые пункты и смотрим исходный код
Как прочитать и изменить код открытой страницы с помощью расширения chrome
Делаю свое 1 расширение chrome, сделал xhr запрос на сайт, смог получить от туда данные. Но я хотел бы теперь получить данные с сайта на котором авторизован пользователь, тут уже xhr не поможет. А еще хотел бы сравнить данные с этого сайта и данные полученные xhr, и выдать результат прямо на странице пользователя. Данные эти — цена товара, на 1 площадке она 1, на другой другая, и надо бы найти выгодное предложение.
Отслеживать
задан 28 янв 2018 в 15:02
Mr Lucky Tomas Mr Lucky Tomas
494 1 1 золотой знак 8 8 серебряных знаков 21 21 бронзовый знак
content скрипт расширения хрома имеет полный доступ к открытой странице (если адрес сайта явно указан в манифесте для данного контент скрипта). И вам не надо самому делать никаких запросов куда либо. Вы просто заходите в браузере на целевую страницу, он ее сам открывает и при этом ваше расширение имеет к ней доступ. Т.е. контент скрипт обращается к ней как будто он на ней загружен, с помощью любых функций работы с DOM
28 янв 2018 в 15:04
Что-то не понял, вот добавил я сайт в манифест, как дальше в js мне получить этот код?
28 янв 2018 в 15:15
Написали куда именно ? Надо описать блок «content_scripts» в котором указываются маски страниц на которых должен запускаться скрипт и указывается этот самый скрипт. Внутри скрипта вы имеете полный доступ к объекту document и можете делать с ним что угодно, точно так же как будто ваш скрипт находится внутри страницы (ну почти так, там есть несколько тонких моментов связанных с безопасностью)
28 янв 2018 в 15:19
developer.chrome.com/extensions/content_scripts там внизу есть ссылки на примеры с готовыми тестовыми расширениями
28 янв 2018 в 15:20
«content_scripts»: [< "matches": ["тут указал нужную страницу"], "js": ["popup.js"] >], Дальше в popup.js я сделал document.getElementsById(‘how_to’).html(), на сайте есть такое ид, но мне ничего не выдает. Вообще ничего. popup.js подключен в popup.html, и срабатывает при нажатии на расширение. Когда сделал отдельный js не привязанный к html, он вообще не запустился.
28 янв 2018 в 15:28
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Доступ к страницам имеют только content скрипты. Минимальный рабочий пример контент скрипта, выводящего имя пользователя StackOverflow, прочитанное со страницы, после чего меняющий рейтинг на +100500 (не отлаживал, если вы не залогинены. так же может перестать работать если SO поменяет дизайн).
Файл js/so.js (папка js должна быть рядом с манифестом):
alert(document.getElementsByClassName('my-profile')[0].childNodes[1].title); document.getElementsByClassName('-rep')[0].innerText="+100500";
Content скрипты имеют полный доступ к страницам, которые описаны в манифесте. Но обычно не могут при этом обращаться ни к каким сторонним сайтам. Скрипт загружается в момент загрузки страницы и удаляется при выходе с этой страницы. Если требуется обмен информацией с другими сайтами, сохранение информации между посещениями страницы и т.п. дополнительно к нему потребуется background-скрипт, обмениваться информацией с которым можно через chrome.runtime.sendMessage
Можно ли посмотреть исходный код расширения для Chrome?
Есть расширение не из магазина (файлы на скрине). Если открыть JavaScript код, то он там будет, но само расширение пользуется только этими файлами для работы или оно может подгружать ещё какие-то файлы с кодом для работы?

- Вопрос задан более трёх лет назад
- 614 просмотров
1 комментарий
Простой 1 комментарий
Получить любой исходный код расширения Chrome с помощью CRX Extractor
Лучший способ научиться программировать – это практиковать и изучать работу других. GitHub делает это достаточно простым для любого языка программирования, который вы можете себе представить. Но для многоязычных проектов, таких как расширения Chrome, вы не найдете столько ресурсов.

Вот где CRX Extractor может помочь. Это бесплатное веб-приложение, которое может извлекать любой исходный код динамически, прямо из расширения браузера Chrome.
Лучше всего, вам даже не нужен установленный плагин! Просто скопируйте / вставьте URL-адрес расширения прямо из Интернет-магазина Chrome и дайте ему поработать. Кроме того, вы можете скачать файл .crx и загрузить его непосредственно на сайт.
Читайте также: 30+ полезных расширений Chrome для веб-дизайнеров
Программы для Windows, мобильные приложения, игры — ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале — Подписывайтесь:)
Если вы нажмете кнопку «Начать» и ничего не произойдет, попробуйте отключить блокировщик рекламы.
Многое происходит за кулисами, чтобы это приложение работало гладко. Можно получить код самостоятельно но это займет гораздо больше работы.
CRX Extractor извлекает метаданные, связанные с файлом, и изменяет расширение в ZIP-архив. Таким образом, вы можете просматривать архив как обычный файл .zip.

Весь процесс очень технический, поэтому большинство разработчиков не хотят иметь с ним дело. Вы можете узнать больше на О странице если вы хотите погрузиться в технарь.
И, как вы можете ожидать от любого отличного веб-приложения, весь проект с открытым исходным кодом и в свободном доступе на GitHub,
Вы должны использовать это веб-приложение главным образом, чтобы узнать, как создаются расширения Chrome и что обеспечивает их безопасность. Просмотрите через Google Руководство по началу работы узнать больше о создании расширений с нуля.
Но ничто не сравнится с опытом поиска исходного кода, чтобы узнать, как профессионалы создают свои расширения. С CRX Extractor вам будет гораздо легче получить этот исходный код для изучения, изучения и тиражирования у лучших разработчиков.
Читайте также: 30 расширений Chrome для повышения производительности в 2017 году
Программы для Windows, мобильные приложения, игры — ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале — Подписывайтесь:)
