无法使用＆＃34; Chrome.storage.sync.set＆＃34;更新键：值对

Question

背景

您好我在Chrome扩展程序中使用chrome.storage。情况是我可能会启动一个键：值对，然后我可能需要修改现有键的值。

所以我编写了以下代码来测试我是否可以修改现有密钥：

var obj = {};
obj['website_name'] = 'test1';
chrome.storage.sync.set(obj, function(){
  chrome.storage.sync.get('website_name', function(data){
    console.log('1st website_name: ', data);
  });
});
obj['website_name'] = 'test2';
chrome.storage.sync.set(obj, function(){
  chrome.storage.sync.get('website_name', function(data){
    console.log('2nd website_name: ', data);
  });
});

这是console.log显示的内容：

两行都显示键：值对是website_name：test2，很奇怪。

有人会告诉我代码是否有问题？

Answer 1

根据您发布的内容，应明确指出正在修改密钥的值。最初，您将其设置为"test 1"，然后将其覆盖为等于"test 2"。

您可以通过分别执行代码的两个块来仔细检查。

你的第一段代码......

obj['website_name'] = 'test1';
chrome.storage.sync.set(obj, function(){
  chrome.storage.sync.get('website_name', function(data){
    console.log('1st website_name: ', data);
  });
});

将“test 1”记录到控制台。

你的第二段代码......

obj['website_name'] = 'test2';
chrome.storage.sync.set(obj, function(){
  chrome.storage.sync.get('website_name', function(data){
    console.log('2nd website_name: ', data);
  });
});

将“test 2”记录到控制台。

那么为什么当你一次性执行所有代码时，“test 2”会被打印两次吗？

这是因为chrome扩展的本地存储API是异步的。基本上发生的事情是第二个代码块在第一个代码块能够检索它之前覆盖website_name的值。因此，当第一个代码块获得密钥时，它已被覆盖并设置为等于"test 2"，因此“test 2”将被记录到控制台两次。

您可以通过将第二个代码块包装在setTimeout。

中来检查这是否正确

var obj = {};
obj['website_name'] = 'test1';
chrome.storage.sync.set(obj, function(){
  chrome.storage.sync.get('website_name', function(data){
    console.log('1st website_name: ', data);
  });
});

setTimeout(function() {
  obj['website_name'] = 'test2';
  chrome.storage.sync.set(obj, function(){
    chrome.storage.sync.get('website_name', function(data){
      console.log('2nd website_name: ', data);
    });
  });
}, 500);

这将第二个代码块的执行延迟了半秒 - 足以说明我上面描述的内容。

您的控制台现在将显示“测试1”，然后显示“测试2”。

实际上，您不会在setTimeout中包装第二个代码块。通常，您不太可能需要存储一个值，然后立即检索它，然后立即重置它。如果在存储第一个密钥之间有半秒钟，然后覆盖它，那么您的代码将完美运行。