如何调用Chrome.Storage.Sync.Get并在页面加载时分配变量？[副本]

Question

我有一个页面，如果设置为true，它应该只加载某个部分。这些设置可在存储中找到。

但是，在加载页面时无法检索这些设置。
我尝试了以下操作：

var permission = true;
chrome.storage.sync.get({ 
    history: true
}, function(items) {
    permission = items.history;
});

但当页面加载时,权限将始终等于true。如果我把一个调用放到另一个函数以打印权限的值，这将不会被调用，直到之后。

我调用这个函数以及加载页面各部分的函数，使用

document.addEventListener('DOMContentLoaded', function () {

我认为问题是函数没有被及时调用，但我不知道如何解决这一点。

Answer 1

你的怀疑是对的。从存储中检索数据后的回调可能会在页面加载后执行。

要解决这个问题，我建议使用Promise：

var p = new Promise(function (resolve, reject) {
    var permission = true;
    chrome.storage.sync.get({
        history: true
    }, function (items) {
        permission = items.history;
        resolve(permission);
    });
});
p.then(function (permission) {
    loadStuff(permission);
});

用async/await重写，但我们仍然必须保证回调：

async function getFromStorage(key) {
    return new Promise((resolve, reject) => {
        chrome.storage.sync.get(key, resolve);
    })
        .then(result => {
            if (key == null) return result;
            else return result[key];
        });
}

let permission = await getFromStorage("history");