Связь между фоновой страницей и всплывающей страницей в расширении Chrome

В настоящее время я пытаюсь написать расширение для Google Chrome, которое можно использовать для загрузки файлов.

Есть две страницы: фоновая страница и всплывающая страница. Всплывающая страница появляется, когда вы нажимаете значок справа от omni-bar. Вы можете указать файл, который хотите загрузить, с помощью стандартного HTML <input type='file' ... />.

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

Когда всплывающее окно активно, а фоновая страница загружает файл на сервер, всплывающее окно должно также получать информацию о ходе загрузки (0-100%) со справочной страницы и отображать эту информацию. По завершении пользователь должен увидеть URL-адрес.

Проблема в том, что я не знаю, как общаться между этими двумя страницами. В документации не очень понятно, как это работает. То, что я пробовал, выполняет функцию на фоновой странице под названием upload(filename) и помещает этот код во всплывающую страницу:

var BGPage = chrome.extension.getBackgroundPage();
BGPage.upload(the_filename);

Но это не сработало, функция не вызывалась.

Кто-нибудь знает, как я могу отправить имя файла со всплывающей страницы на фоновую страницу и как получить статус загрузки (и, наконец, ссылку) со справочной страницы, через всплывающее окно?

Спасибо заранее!

Ответы

Ответ 1

Определите его как переменную.

background.js

upload = function(fileName) {
  console.log('Uploading', fileName);
}

popup.html

<script src="popup.js"></script>

popup.js

var BGPage = chrome.extension.getBackgroundPage();
BGPage.upload(the_filename);

Это должно сработать. Если это не так, проверьте свой инспектор на всплывающей и фоновой странице:

  • Popup Inspector: Щелкните правой кнопкой мыши по всплывающему окну и выберите "Осмотреть"
  • Фоновый инспектор. На странице настроек расширения chrome://расширения, включите режим разработчика (вверху справа вверху) и нажмите на background.js.

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