javascript - 保存并使用 chrome.sync.storage.get() 中的值

Question

我正在 chrome 上编写一个小扩展，并尝试使用 chrome.storage。 在我的选项页面上，我保存了一些我将在 content_script 上获得的信息:

在options.js

function save_options() {
      var color = document.getElementById('color').value;
      chrome.storage.sync.set({
        favoriteColor: color
      }, function() {
        console.log("Color saved");
      });
    }

但我在 content_script.js 上使用此信息时遇到问题。我尝试过:

    var color = null;
    chrome.storage.sync.get('favoriteColor', function(item){
        color = item.favoriteColor;
        //alert(color); //Here works;
});

alert(color); // here doesn't work

Answer 1

<强> chrome.storage API 是异步的，这意味着即使在定义变量 color 之前它也会执行警报，这就是为什么你总是得到未定义的原因。您需要等待 get 方法完成。您可以在 content_script.js 中设置回调函数，该函数仅在定义颜色后执行:

    var color = null;
        chrome.storage.sync.get('favoriteColor', function(item){
            color = item.favoriteColor;
            alertColor(color);
    });

    function alertColor(color){
        alert(color);
    }