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

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

11.09.2018, 13:55. Показов 8416. Ответов 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,148
Записей в блоге: 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,148
Записей в блоге: 43
11.09.2018, 22:09
Лучший ответ Сообщение было отмечено koker007 как решение

Решение

koker007, по поводу документации: у хрома она действительно не очень. Я обычно пользуюсь документацией к расширениям файрфокса, но там хоть и те же апи, но ряд нюансов все-таки присутствует, так что надо понимать где что делается иначе, но зато там есть примеры. Можно еще к Edge документацию посмотреть, там вроде тоже более понятно, но тоже есть нюансы.
Небольшой пример я набросал, он во вложении. Собственно что делает пример. Когда жмешь на иконку расширения, то код страницы выводится в консоль из бэкграунда. Там я не использовал query, как в примере выше, по той причине, что все делается в обработчике клика по иконке, а он имеет параметр, как раз содержащий информацию об активной вкладке. А так все попытался написать предельно просто и компактно. Изучи пример, мне кажется, там все не очень сложно.
Вложения
Тип файла: zip get-page-code.zip (3.2 Кб, 88 просмотров)
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
Ответ Создать тему
Новые блоги и статьи
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка.
Programma_Boinc 23.12.2025
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка. Рецензия / Мнение/ Перевод https:/ / **********/ gallery/ thinkpad-x220-tablet-porn-gzoEAjs . . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Как объединить две одинаковые БД Access с разными данными
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru