Как сохранить в localStorage на странице настроек и получить его в фоновом режиме?

Question

Я все еще пытаюсь сохранить пользовательскую электронную почту, введенную в options.html, в переменную extension_user в background.html, как предложено в этом ответе .Я надеюсь, что кто-то может помочь.

На странице настроек у меня есть текстовая область id="getEmail", которая принимает электронную почту пользователя и сохраняет введенную электронную почту в localStorage:

//save entered gmail address
document.getElementById("save").addEventListener(
    "click", function ()
    {
        var user = document.getElementById("getEmail").value;
        localStorage.setItem("user", user);
        console.log("gmail id saved as " + user);
    } , false)

Теперь я хочувозьмите это письмо в background.html и сохраните его как «extension_user».В background.html у меня есть

if (localStorage.getItem("user"))
{
    user = localStorage.getItem("user")
    //localStorage.clear()
    console.log("if(!user): " + user)
    //...    
    // run normal program
    //...
}
else
{
    chrome.tabs.create({url: "/options.html"});
    console.log("options page opened as new tab");
}

Что происходит, если фоновая страница видит сохраненного «пользователя», только если я перезагружаю расширение после того, как я сохранила письмо на странице параметров.

Что такоеЯ скучаю?

И лучше ли использовать передачу сообщений и отправлять сохраненную в настройках электронную почту пользователя прямо на фоновую страницу?Я ценю любые предложения, чтобы сохранить эту электронную почту пользователя на фоновой странице постоянно с или без localStorage.Спасибо!

ОБНОВЛЕНИЕ с помощью ответа Сергея

background.html

function refreshUser ()
{
    user = localStorage.getItem("user");
    console.log("user inside of refreshUser function " + user);
}

user = localStorage.getItem("user");
if (!user)
{
    refreshUser(); 
    //user is not defined outside refreshUser()
    console.log("user outside of refreshUser function" + user);
    //run the rest of code here
    //...
}
else
{
    user = localStorage.getItem("user"); 
    console.log("this is the else close")
    //run the rest of code here
    //...

}

ОБНОВЛЕНИЕ

@ serg Я обновил код следующим образом, но все еще вижу, что newUser обновляется внутри функции refreshUser(), но это null вне функции.Что я делаю не так?

newUser = localStorage.getItem("user");
console.log("first newUser " + newUser);
//newUser=null

function refreshUser() 
{
    newUser = localStorage.getItem("user");
    console.log("newUser inside of refreshUser function " + newUser);
    //newUser is updated with saved email in localStorage
}

console.log("newUser after refreshUser() " + newUser);
//newUser=null

Обновление

После ответа Сергея это работает:

function refreshUser () 
{
    newUser = localStorage.getItem("user");
}

...

formData.append("extension_user", newUser);

Answer 1

Фоновая страница загружается при запуске браузера и остается загруженной постоянно. Когда вы сохранили пользователя на странице параметров, фоновая страница не знает, что значение localalstorage изменилось, поэтому вам нужно как-то уведомить об этом.

Самый простой подход - вызывать какой-либо метод внутри фоновой страницы после обновления пользователя:

//options
localStorage.setItem("user", user);
chrome.extension.getBackgroundPage().refreshUser();

//bg page
function refreshUser() {
    //user in localStorage is updated, read it
}