Не удается связаться со скриптом контента для всплывающего окна в расширении Chrome

Question

Я пробую свои силы в своем первом расширении Chrome.
Я наткнулся на проблему, из-за которой я не могу связаться от скрипта контента до всплывающего окна.

Контекст:
Мое всплывающее окно содержит некоторые данные localStorage, которые я хочу извлечь из скрипта содержимого при обновлении / инициализации страницы, чтобы я мог использовать эти данные на странице.

Если я правильно понимаю официальную документацию , это должно быть возможно.
В нем говорится:

"Отправка запроса из сценария содержимого выглядит следующим образом:"

chrome.runtime.sendMessage({greeting: "hello"}, function(response) {
  console.log(response.farewell);
});

Итак, я попробовал это, и я вижу, что приведенный выше фрагмент кода запускается из сценария JS, который я внедрил (сценарий содержимого), но я предполагаю, что я его не "слушаю""правильно во всплывающем окне.

Это мой код:

Сценарий содержимого (функция запускается во время выполнения)

function getLocalStorageItems() {
chrome.runtime.sendMessage({task: "retrieve-local"}, function(response) 
  {
    console.log(response.farewell);
  });
}

Я сохранилпример функции максимально исправен.

всплывающее окно js

chrome.runtime.onMessage.addListener((request, sender, sendResponse) => 
  {
    if ( request.task == "retrieve-local" ) {
      console.log('retrieve-local');
  }
});

манифест

{
  "manifest_version": 2,
  "name": "Maxxton Dev Extension",
  "description": "Extension for Maxxton Developers",
  "version": "1.0",
  "browser_action": {
    "default_icon": "icon.png",
    "default_popup": "index.html"
  },
  "content_scripts": [
    {
      "matches": ["*://*/*"],
      "js": ["injected.js"],
      "run_at": "document_end"
    }
  ]
}

я никогда не вижуconsole.log регистрируется во всплывающем окне.

Я подумал, что это может быть связано с тем, что я пытаюсь chrome.runtime.onMessage, поскольку отправка сообщения из всплывающего окна chrome.tabs.query.Поэтому я попытался изменить его на chrome.tabs.onMessage, но это тоже ничего не дало.

Теперь я думаю, что это, возможно, даже невозможно, потому что всплывающее окно неактивно / неактивно.Но я не уверен.И я ничего не могу найти по этому вопросу.

Answer 1

Я сделал эту работу с фоновым скриптом.Я не знаю, как работает "browser_action", но когда я пытался с "page_action", я заметил, что страница воссоздалась всякий раз, когда я нажимал на кнопку (так что она, вероятно, не существовала и не прослушивалась, если бы в данный момент не появлялась).

Я предлагаю вместо этого хранить данные в фоновом режиме, а содержимое и всплывающее окно взаимодействовать с фоном.

Добавьте в манифест:

"background": {
   "scripts": [
     //"you_probably_have_something_here_to_register_browser_action?", 
     "background_data_manager.js", //this will be your script to manage data
   ],
   "persistent": false
},

Поместите слушателя и весь код для обработки данных в файл background_data_manater.js.

Для доступа к фоновой консоли перейдите в инструменты Chrome и откройте страницу расширений с включенным режимом разработчика.Там вы увидите небольшую ссылку о просмотрах в вашем расширении.Эта ссылка открывает консоль для фона.

Вы должны увидеть ожидаемые журналы в этой консоли.