如何爲Chrome擴展程序存儲多個選項？

Question

我正在研究Chrome擴展程序，該擴展程序會用不同詞語替換網站上的文字。 我允許用戶輸入他們自己的話說，他們希望進行更換，並且我保存這些是這樣的：

function storeOptions(){ 
var words = new Object(); // storageArea.set() method takes an object that contains all the items to be stored. This Object contains those. 
$("option").each(function(key,value){ // .each(index, element) 
words[value.id] = value.text; 
chrome.storage.sync.set(words, function(){console.log("Stored: "+value.text);}); 
}); 
} 

之前，這是實現我成功地啓用和禁用與所使用的設置的browseraction延伸存儲在同一個storagearea以類似的方式：

chrome.storage.sync.set({"status":"enabled"}); 

我現在面臨的問題是，實現增加單詞的選項後，狀態或者沒有被妥善保存，或透過該選項的影響，因爲當我嘗試檢索它，它沒有「enabled」或「disabled」值，如下所示：

chrome.storage.sync.get("status", function(result) { 
    console.log("status: "+result["status"]); // status: status 
}); 

我在想，也許我可以存儲的單詞來替換爲所謂的像的方式數組：

chrome.storage.sync.set({"words" : words}); 

然後，我會通過獲取「身份」能夠在兩個分化或「單詞」，但那不起作用。

如何儲存狀態和單詞而不會相互干擾？

Answer 1

您所描述的發生的唯一原因是，如果存在<option>元素，其編號爲status且值爲status（在這種情況下，它將覆蓋原始狀態）。

在任何情況下，是（如你所說）一個好主意，在內部存儲對象（不一定是一個數組）「封裝」的所有期權相關的鍵值對。

（最後，沒有必要一個接一個來存儲值。這將是更有效的方法首先創建整個對象，然後將其與以chrome.storage.sync.set()單個調用存儲）。

function storeOptions() { 
    var words = {}; 
    $('option').each(function(idx, element) { 
     words[element.id] = element.text; 
    }); 
    chrome.storage.sync.set({ words: words }); 
} 

現在你storage.sync將尋找這樣的：

{ 
    "status": "enabled", 
    "words": { 
     "option_id1": "option_text1", 
     "option_id2": "option_text2", 
     ... 
    } 
} 

您可以檢索值這樣的：

/* Retrieve the extension status: */ 
chrome.storage.sync.get('status', function(items) { 
    var status = items.status; 
    ... 
}); 

/* Retrieve the words: */ 
chrome.storage.sync.get('words', function(items) { 
    var words = items.words; 
    for (var key in words) { 
     console.log('Replacing "' + key + '" with "' + words[key] + '"...'); 
     ... 
    } 
}); 

Answer 2

我不確定鉻存儲，但html5存儲API，localstorage和sessionstorage都是用來存儲鍵和值，而不是鍵和對象。

您需要將您的單詞對象串起來以將其存儲爲值。