розширення google chrome :: console.log () з фонової сторінки?


173

Якщо я дзвоню console.log('something');зі спливаючої сторінки або будь-якого скрипта, включеного, він працює добре.

Однак, оскільки фонова сторінка не працює безпосередньо зі спливаючою сторінкою, вона не входить до консолі.

Чи є спосіб, щоб я міг потрапити console.log()на фонову сторінку, щоб відобразитися на консолі для спливаючої сторінки?

Чи є можливість із фонової сторінки викликати функцію на спливаючої сторінці?


Що саме ви маєте на увазі, кажучи "це добре працює"? Де читають "щось"? Використовуючи console.log () у спливаючому вікні не слід друкувати на консолі завантаженої сторінки - оскільки питання два роки було, чи змінився API?
— anddam

14
якщо ви клацніть правою кнопкою миші -> перевірити спливаюче вікно дії браузера, ви отримаєте сторінку інструментів для розробників для свого розширення. popup.js надрукує журнали до цього.
— not_shitashi

Коментар @ not_shitashi повинен відповісти на це питання.
— Гейб

Відповіді:


154

Будь-яка сторінка розширення (крім скриптів вмісту ) має прямий доступ до фонової сторінки через chrome.extension.getBackgroundPage().

Це означає, що в межах спливаючої сторінки ви можете просто зробити:

chrome.extension.getBackgroundPage().console.log('foo');

Щоб полегшити використання:

var bkg = chrome.extension.getBackgroundPage();
bkg.console.log('foo');

Тепер, якщо ви хочете зробити те ж саме у скриптах вмісту, вам потрібно скористатися передачею повідомлень, щоб досягти цього. Причина, вони обидва належать до різних областей, що має сенс. На сторінці проходження повідомлень є багато прикладів, які ви можете перевірити.

Сподіваюсь, що все очистить.


1
@MohamedMansour, це рішення для мене не працює. Якщо я alert() chrome.extension.getBackgroundPage(), я отримую null. Чи потрібно мати встановлені дозволи чи іншу конфігурацію?
— gwg

@gwg чи має ваше розширення фонову сторінку? Відповідно до документації "Повертає нуль, якщо розширення не має фонової сторінки". developer.chrome.com/extensions/…
— Мохамед Мансур

Це ідеально підходить для моїх власних повідомлень, які можна втішити. Дякую. Будь-які думки про те, як зробити винятки тощо з popup.js з'являються на консолі background.js?
— steven_noble

195

Ви можете відкрити консоль фонової сторінки, натиснувши посилання "background.html" у списку розширень.

Щоб отримати доступ до фонової сторінки, що відповідає вашим розширенням, відкрийте Settings / Extensionsабо відкрийте нову вкладку та введіть chrome://extensions. Ви побачите щось подібне на цьому скріншоті.

Діалог розширень Chrome

Під розширенням натисніть на посилання background page. Це відкриває нове вікно. Для зразка контекстного меню вікно має заголовок: _generated_background_page.html.


4
Ура, я знаю про це, проте відкриття фонової сторінки безпосередньо не посилається на спливаючу сторінку.
— Гейлвуд

Відкриття фонової сторінки не видає жодної інформації консольного журналу.
— Layke

@Hailwood відкриття фонової сторінки нічого не викликає, але покаже консоль для фонової сторінки.
— anddam

1
@Layke після відкриття фонової сторінки вам все одно доведеться писати на неї, тобто безпосередньо використовувати console.log () з фонової сторінки або, як сказав Мохамед-Мансур, називаючи той самий метод на об'єкті, поверненому getBackgroundPage ()
— anddam

3
Я знайшов це запитання, шукаючи, як перевірити вихід розширення (наприклад, ОП) і вважав цю відповідь дуже корисною, оскільки це дозволило мені перевірити журнал консолі, не переходячи на сторінку вмісту.
— anddam

66

Щоб відповісти на ваше запитання безпосередньо, коли ви телефонуєте console.log("something")з фону, це повідомлення реєструється на консолі фонової сторінки. Щоб переглянути його, ви можете зайти chrome://extensions/та натиснути його inspect viewпід розширенням.

Коли ви натискаєте спливаюче вікно, воно завантажується на поточну сторінку, таким чином console.log повинен відображати повідомлення журналу на поточній сторінці.


Я також! Він найпростіший і прямий.
— SaidbakR

моє розширення не має цього, проте інші розширення роблять! як я це дозволяю
— Ахмед Ід

Якщо у вас є 3 монітори, як я, поверніть голову. Це відкривало ChromeDevTools на протилежному кінці моїх моніторних масивів, і я його не бачив.
— mpen

26

Ви все ще можете використовувати console.log (), але він потрапляє в окрему консоль. Для того, щоб переглянути його - клацніть правою кнопкою миші на значку розширення та виберіть "Перевірити спливаюче вікно".


12

Найпростішим рішенням було б додати наступний код у верхній частині файлу. І тоді ви можете використовувати всі повноцінні api консолі Chrome, як зазвичай.

 console = chrome.extension.getBackgroundPage().console;
// for instance, console.assert(1!=1) will return assertion error
// console.log("msg") ==> prints msg
// etc

9
const log = chrome.extension.getBackgroundPage().console.log;
log('something')

Відкрити журнал:

  • Відкрито: chrome: // розширення /
  • Деталі> Фонова сторінка

Ви б не хотіли дати ще кілька пояснень своїм командам?
— inetphantom

7

Спробуйте це, якщо ви хочете увійти до консолі активної сторінки:

chrome.tabs.executeScript({
    code: 'console.log("addd")'
});

1
Потрібні дозволи хоста для поточної вкладки.
— Xan

Ви можете додати його для тестування та видалити, якщо ви випустите аддон.
— Фаз

1

Щодо оригінального питання, я хотів би додати до прийнятої відповіді Мохамеда Мансура, що існує також спосіб зробити цю роботу навпаки:

Ви можете отримати доступ до інших сторінок розширення (тобто сторінки опцій, спливаючої сторінки) з фонової сторінки / сценарію за допомогою chrome.extension.getViews()виклику. Як описано тут .

 // overwrite the console object with the right one.
var optionsPage = (  chrome.extension.getViews()  
                 &&  (chrome.extension.getViews().length > 1)  ) 
                ? chrome.extension.getViews()[1] : null;

 // safety precaution.
if (optionsPage) {
  var console = optionsPage.console;
}

1

Це старий пост, з уже хорошими відповідями, але я додаю свої два біти. Мені не подобається використовувати console.log, я б скоріше використовував реєстратор, який реєструється до консолі, або де б я хотів, тому у мене є модуль, який визначає функцію журналу трохи подібну до цієї

function log(...args) {
  console.log(...args);
  chrome.extension.getBackgroundPage().console.log(...args);
}

Коли я закликаю журнал ("це мій журнал"), він запише повідомлення як у спливаючу консоль, так і на фоновій консолі.

Перевагою є можливість змінити поведінку журналів, не змінюючи код (наприклад, відключення журналів для виробництва тощо).


0

Щоб отримати журнал консолі з фонової сторінки, потрібно написати наступний фрагмент коду на своїй фоновій сторінці background.js -

chrome.extension.getBackgroundPage (). console.log ('привіт');

Потім завантажте розширення та огляньте його фонову сторінку, щоб побачити журнал консолі.

Вперед !!

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.