Как передать значение из background.js в скрипт, использующийся для генерации содержимого html?

Задача на текущем этапе такая: написать расширение для Chrome, которое:

  • анализирует URL на вкладке, которая была открыта, когда щёлкнули по иконке
  • загружает разные html страницы в зависимости от результата

Структура такая:

./css
./html
    success.html
    failure.html
./icons
./js
    background.js
    buildErrorMessage.js
manifest.json

Содержимое background.js:

'use strict';

var onErrorMessage;

chrome.browserAction.onClicked.addListener(
  function() {
    var callerTabHostName;

    chrome.tabs.query({currentWindow: true, active: true}, function(tabs){
      callerTabHostName = tabs[0].url;
    });

    var regexp = new RegExp('(192\.168\.125\.100|192\.168\.129\.100)');
    var result = regexp.test(callerTabHostName) ? true : false;

    if (result) {
      chrome.tabs.create({url: chrome.extension.getURL('../html/success.html')});
    } else {
      onErrorMessage = 'Mismatch URL';

      chrome.runtime.sendMessage({message: onErrorMessage });

      chrome.tabs.create({url: chrome.extension.getURL('../html/failure.html')});
    }
  }
);

Содержимое failure.html:

<div id="error-message-wrapper" class="error-message-wrapper">
  <div id="error-message-title" class="title">
    Error occurred:
  </div>
  <div id="error-message-content" class="content">
    <p id="message-text"></p>
    <script src="../js/buildErrorMessage.js"></script>
  </div>
</div>

Содержимое buildErrorMessage.js:

'use strict';

var message;

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    message = request.message;
  }
);

var p = document.getElementById("message-text");
var t = document.createTextNode(message);

p.appendChild(t);

Результат: сообщение из background.js не проходит, содержимое message = 'undefined'

Вопрос: как нужно делать, чтобы работало?

Дополнительный вопрос: возможно ли такое провернуть с popup, т.е. "на лету" генерировать различное его содержимое, не открывая отдельных вкладок?


Ответы (0 шт):