Как отправить данные между background.js и popup.js, если всплывающее окно закрыто?

Question

Мне нужно отправить данные из popup.js в background.js и после этого отправить из background.js в popup.js.Но если popup.html закрылся, он не может получить данные из background.js, потому что порт не существует.Как это решить?

Мой код:

popup.js

var port = chrome.runtime.connect({ 
name: 'Communication with background.js', 
});

port.postMessage("Hi BackGround");
port.onMessage.addListener(function(msg) {
console.log("message recieved" + msg);
});

background.js

chrome.runtime.onConnect.addListener(function(port) {
console.log("Connected .....");
port.onMessage.addListener(function(msg) {
console.log("message recieved " + msg);
port.postMessage("Hi Popup.js");
});
});

Answer 1

После исчезновения всплывающего окна порт не только закрывается, но и скрипт popup.js больше не работает.Вы можете либо сохранить содержимое в скрипте background.js (постоянный), и каждый раз при загрузке всплывающего окна отправлять соответствующую информацию (у вас это уже частично построено), либо вы можете хранить информацию в локальном хранилище и загружать ее каждый раз.время загрузки вашего всплывающего окна.

popup.js или background.js

chrome.storage.sync.set({'dataValue1': 'Some data 1.'});
chrome.storage.sync.set({'dataValue2': 'Some data 2.'});

popup.js

function updatePopup(){
  chrome.storage.sync.get(['dataValue1','dataValue2'], function(data) {
    //Update popupElement1 and popupElement2 with loaded data
    document.getElementById("popupElement1").value = data.dataValue1;
    document.getElementById("popupElement2").value = data.dataValue2;

  });
}

document.addEventListener('DOMContentLoaded', updatePopup);