javascript - 为 chrome.local.set 重写 localStorage javascript

Question

我有这段代码正在处理 localStorage html5 调用。但是，它必须针对 Chrome 桌面应用程序进行重写，而且我不知道如何将其移植。

window.fakeStorage = {
  _data: {},

  setItem: function (id, val) {
    return this._data[id] = String(val);
  },

  getItem: function (id) {
    return this._data.hasOwnProperty(id) ? this._data[id] : undefined;
  },

  removeItem: function (id) {
    return delete this._data[id];
  },

  clear: function () {
    return this._data = {};
  }
};

function LocalScoreManager() {
  this.key     = "bestScore";

  var supported = this.localStorageSupported();
  this.storage = supported ? window.localStorage : window.fakeStorage;
}

LocalScoreManager.prototype.localStorageSupported = function () {
  var testKey = "test";
  var storage = window.localStorage;

  try {
    storage.setItem(testKey, "1");
    storage.removeItem(testKey);
    return true;
  } catch (error) {
    return false;
  }
};

LocalScoreManager.prototype.get = function () {
  return this.storage.getItem(this.key) || 0;
};

LocalScoreManager.prototype.set = function (score) {
  this.storage.setItem(this.key, score);
};

我收到的错误是“window.localStorage 在打包应用程序中不可用。请改用 chrome.storage.local。”

到目前为止，我尝试重写它是这样的..但它在这个过程中的某个地方出现了问题。

$(document).ready(function() {


$("body").bind('keyup', function() {
      var number = $(".best-container").val();

if(number == 'undefined'){
 var number = "0";
}

    chrome.storage.local.set({'bestScore': number});
});



chrome.storage.local.get('bestScore', function (result) {
     hello= result.bestScore || 0;
    $(".best-container").val(hello);
});



});

Answer 1

将 localStorage 移植到 chrome.storage 有一个重要的陷阱:chrome.storage 方法是异步的，而 localStorage 访问是同步的。

这意味着:如果您在调用 set 方法的回调之前尝试从 chrome.storage 获取值，该值仍将是未定义的

错误的方式:

chrome.storage.local.set({'key': value});
...
chrome.storage.local.get('key', function(items) {
   if(items.key)         // won't be able to find the key
      alert(items.key);
});

正确方法:

chrome.storage.local.set({'key': value}, function() {
   ...
   chrome.storage.local.get('key', function(items) {
      if(items.key)
         alert(items.key); // will be "value"
   });
});

或者更确切地说:

chrome.storage.local.set({'key': value}, function() {
   doFurtherStuff();
});

function doFurtherStuff() {
   ...
   chrome.storage.local.get('key', function(items) {
      if(items.key)
         alert(items.key); // will be "value"
   });
}