Форум программистов, компьютерный форум, киберфорум
JavaScript: API
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.60/40: Рейтинг темы: голосов - 40, средняя оценка - 4.60
 Аватар для koker007
59 / 52 / 11
Регистрация: 04.08.2015
Сообщений: 731

Chrome.tabs - получить html код вкладки

11.09.2018, 13:55. Показов 8487. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Добрый день, подскажите пожалуйста с какими функциями chrome.tabs можно получить Html код активной вкладки узнать url адрес этой вкладки?
и допустим добавить весь полученный код к себе на страницу из которой выполняются эти действия, в моем случае это backgraund-script для расширения. Спасибо.
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
11.09.2018, 13:55
Ответы с готовыми решениями:

Вкладки Responsive tabs. Код прикрепил
Всем добрый день! Помогите разобраться в коде данного скрипта: http://codepen.io/ntin12/pen/BHzjG . Подскажите, как сделать чтобы при...

Chrome.tabs.executeScript() - ошибка
Добрый день, использую функцию chrome.tabs.executeScript() чтобы встроить код в конкретную указанную страницу, на моем пк все работает...

Как исправить работу chrome.tabs.remove?
Доброго времени суток. Имеется расширение, которое было допилинно под свои нужды. Расширение умеет закрывать вкладки, если их более...

3
 Аватар для diadiavova
7258 / 2605 / 744
Регистрация: 11.04.2015
Сообщений: 4,150
Записей в блоге: 43
11.09.2018, 15:16
koker007, урл получить несложно, а именно - с помощью методо query, чтобы оно возвращал данные о текущей вкладке, надо передать ему опции { active: true, currentWindow: true }. А вот с получением кода страницы дело обстоит несколько сложнее. Дело в том, что прямой доступ к DOM страницы получить извне - невозможно. Поэтому можно, используя метод executeScript в контексте вкладки, получить код страницы и отправить его бэкграундскрипту через сообщение, а в самом скрипте уже ловить его. Схема достаточно сложная, начать можно так
JavaScript
1
2
3
4
5
6
7
8
9
10
11
        chrome.tabs.query({ active: true, currentWindow: true }, function (activeTab)
        {
            // Здесь уже activeTab.url должен возвратить урл вкладки
            chrome.tabs.executeScript(activeTab.tabId, { code: `
            // Здесь код отправляющий нужные данные (в данном случае код страницы) сообщением
            // Код передается строкой, но лучше написать его в отдельном файле и испоьзовать опцию file, вместо code 
            ` }, function (data)
            {
 
            });
        });
Собственно код получающий хтмл - достаточно обычный, что-то типа
JavaScript
1
let html = document.documentElement.outerHTML
Ну, или что-то в этом роде. Что касается сообщений, то я рекомендую отправлять их в формате {command: message}, чтобы в принимающем скрипте можно было каждую команду обрабатывать отдельно, поскольку расширение может отправлять множество сообщений и их надо как-то различать.
1
 Аватар для koker007
59 / 52 / 11
Регистрация: 04.08.2015
Сообщений: 731
11.09.2018, 19:07  [ТС]
Спасибо, код действительно получилось встроить. Также я нашел еще похожий метод, только тут не используются команды, а с встроеной функцией после ее выполнения возвращается значение через ретурн. https://stackoverflow.com/ques... om-content

В общем код действительно возвращается и его можно посмотреть в консоле. используя тот код. но вот встроить его в мою бекграунд скрипт пока не вышло.. кажется дело в том что теряется тип данных и когда значение возвращается через ретурн то это уже не текст, пробовал через Jquery и обычными методами javascript.. ничего..

Попробую разобраться с отправками команд может тут то и получится как текст вытащить.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
    load_get_script_for_tabs(){
        //Грузим все табы
        chrome.tabs.query({url:"https://olymptrade.com/platform"},function(tab)
            {   
                //Если вкладки нет, открываем
                if(tab.length == 0){
                    chrome.tabs.create({url:"https://olymptrade.com/platform"}, function(){});
                    
                }
                //Если вкладка найдена
                else{
                    //Если код уже есть удаляем старую инфу
                    $('#OLIMP_main').remove();
                    //Создаем заного отсек под код
                    $('body').append('<div id="OLIMP_main" class="HTML_OLIMP">Тут будет загружена страница олимпа</div>');
                    
                    
                    chrome.tabs.executeScript(tab[0].tabId, { code: '(' + modifyDOM + ')();' }, (results) =>
                    {
                        console.log('Popup script:');
                        console.log(results[0]);
                        
                        var text_html = " ";
                        for(var x = 0; x < results.length; x++){
                            text_html = text_html + results[x];
                        }
                        //Встраиваем код в отсек
                        $('#OLIMP_main').append(text_html);
                        
                    });     
                }
            }
        
        );
        
    }
JavaScript
1
2
3
4
5
6
    function modifyDOM() {
        //You can play with your DOM here or check URL against your regex
        console.log('Tab script:');
        console.log(document.body);
        return document.body.innerHTML;
    }
Добавлено через 34 минуты
diadiavova, Пожалуйста приведите пример отправки и получения команды, а то я ничего дельного не найду..
в документации по chrome.commands, никаких примеров толком нет, просто описание. И еще, я так понимаю если команда была отправлена она так и будет каждый раз получаться через chrome.commands.getAll() или нет? а то я не вижу как удалить команду после выполнения. чтобы chrome.commands.getAll() каждый раз ее не выдавал, а то мне ведь нужно мониторить ту страницу, код которой нужно передать. Следить за изменениями в общем.
0
 Аватар для diadiavova
7258 / 2605 / 744
Регистрация: 11.04.2015
Сообщений: 4,150
Записей в блоге: 43
11.09.2018, 22:09
Лучший ответ Сообщение было отмечено koker007 как решение

Решение

koker007, по поводу документации: у хрома она действительно не очень. Я обычно пользуюсь документацией к расширениям файрфокса, но там хоть и те же апи, но ряд нюансов все-таки присутствует, так что надо понимать где что делается иначе, но зато там есть примеры. Можно еще к Edge документацию посмотреть, там вроде тоже более понятно, но тоже есть нюансы.
Небольшой пример я набросал, он во вложении. Собственно что делает пример. Когда жмешь на иконку расширения, то код страницы выводится в консоль из бэкграунда. Там я не использовал query, как в примере выше, по той причине, что все делается в обработчике клика по иконке, а он имеет параметр, как раз содержащий информацию об активной вкладке. А так все попытался написать предельно просто и компактно. Изучи пример, мне кажется, там все не очень сложно.
Вложения
Тип файла: zip get-page-code.zip (3.2 Кб, 90 просмотров)
1
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
11.09.2018, 22:09
Помогаю со студенческими работами здесь

Получить код вкладки в Chrome
Доброго дня. Имеется браузер Google Chrome, на нем могут быть открыты вкладки определенного ресурса. Например ресурс имеет url:...

Получить html код открытой в Google Chrome страницы
Как достать html код сейчас открытой страницы из хрома?

Как загрузить HTML открытой вкладки в Chrome
Добрый день, меня интересует вопрос: можно ли с помощью JS в браузере открыть вкладку, дождаться пока она загрузится и выполнит все...

Как вытащить HTML из активной вкладки браузера Chrome?
Всем привет! Всю ночь форум копал :wall: Надо найти баланс в самом низу страницы и никак не могу получить код для парсинга - в адресной...

Как получить ID процесса открытой вкладки в Chrome
У Chrome много процессов. И мне нужно получить ID определённой вкладки. У меня открыто например 10 вкладок. И 1 имеет названия (заголовок)...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL3_image
8Observer8 10.02.2026
Содержание блога Библиотека SDL3_image содержит инструменты для расширенной работы с изображениями. Пошагово создадим проект для загрузки изображения формата PNG с альфа-каналом (с прозрачным. . .
Установка Qt-версии Lazarus IDE в Debian Trixie Xfce
volvo 10.02.2026
В общем, достали меня глюки IDE Лазаруса, собранной с использованием набора виджетов Gtk2 (конкретно: если набирать текст в редакторе и вызвать подсказку через Ctrl+Space, то после закрытия окошка. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru