Question

我正在尝试使用以下代码在Chrome扩展程序中设置和获取名称值对。

if (!this.Chrome_getValue || (this.Chrome_getValue.toString && this.Chrome_getValue.toString().indexOf("not supported") > -1)) {
    this.Chrome_getValue = function (key, def) {
        chrome.storage.local.get(key, function (result) {
            return result[key];
        });
    };
    this.Chrome_setValue = function (key, value) {
        var obj = {};
        obj[key] = value;
        return chrome.storage.local.set(obj)
    }
}

然后我按如下方式调用它们：

Chrome_setValue("City", "London");

var keyValue = Chrome_getValue("City");

问题是keyValue总是'未定义'，即使我在尝试回读该值时放置了1秒的延迟。我理解这是因为'chrome.storage.local.get'函数是异步的..以下代码工作正常。

Chrome_setValue("City", "London");

chrome.storage.local.get("City", function (result) {
     alert(result["City"]);
});

绑定keyValue时有什么办法（使用get）我可以强制代码等待函数返回响应吗？或许我正在从错误的角度接近这个。基本上我正在寻找一种方法，我可以抽象出set和get方法来处理chrome.storage框架中的数据？理想情况下，我可以调用两个简单的函数来设置和检索名称值对。

在我使用localStorage之前，这非常简单。

//Set
localStorage["City"] = "London";

//Get
var keyValue = localStorage["City"];

Answer 1

QF_D，我在这里进行了有根据的猜测，所以要为第一次做好准备......

.....这里是：

if (!this.Chrome_getValue || (this.Chrome_getValue.toString && this.Chrome_getValue.toString().indexOf("not supported") > -1)) {
    this.Chrome_getValue = function (key, def) {
        var dfrd = $.Deferred();
        chrome.storage.local.get(key, function (result) {
            dfrd.resolve(result[key]);
        });
        return dfrd.promise();
    };
    this.Chrome_setValue = function (key, value) {
        var dfrd = $.Deferred();
        var obj = {};
        obj[key] = value;
        var listen = function(changes, namespace) {
            dfrd.resolve(changes[key]);
            chrome.storage.onChanged.removeListener(listen);//remove, to prevent accumulation of listeners
        }
        chrome.storage.onChanged.addListener(listen);
        chrome.storage.local.set(obj);
        return dfrd.promise()
    }
}

get和set函数应返回jQuery promise。 set函数返回的promise通过StorageChange对象定义here来解决。通常，您不需要此对象，而只需响应正在解决的承诺。

以上所有内容均未经测试。我不太确定：

chrome.storage.onChanged....。它应该是chrome.storage.local.onChanged....吗？
.removeListener()。如果addListener存在，它应该存在似乎是合理的，尽管我找不到任何证据。

Answer 2

嗯，这主要是因为chrome.storage API是异步。您正面临着JavaScript的核心。

chrome.storage.get未在chrome.storage.get回调中执行的内容。你有两种处理方式：

处理回调中的存储值
使用Promise模式让您的代码感觉同步（参见上一个答案）

你必须弄清楚同步和异步之间的区别。

如何使用Chrome.storage API等待javascript函数返回响应？

2 个答案: