chrome.storage.local.get and set

Question

I'm trying to use chrome.storage.local in my extension, and it doesn't seem to work. I used localStorage but realized that I can't use it in content scripts over multiple pages.

So, this is what I've come up with:

function save()
{
    var channels = $("#channels").val();
    var keywords = $("#keywords").val();

    chrome.storage.local.set({'channels': channels});
    chrome.storage.local.set({'keywords': keywords});
}

I do believe I'm doing the save() right, but the problem comes up in load():

function load()
{
    var channels = "";
    chrome.storage.local.get('channels', function(result){
        channels = result;
        alert(result);
    });

    var keywords = "";
    chrome.storage.local.get('keywords', function(result){
        keywords = result;
        alert(result);
    });

    $("#channels").val(channels);
    $("#keywords").val(keywords);
}

When the alerts trigger, it prints out [object Object]. Why is that? What am I doing wrong? I looked at the documentation/examples, but I can't seem to pinpoint the problem.

score 75 · Accepted Answer · edited Jun 20 '20 at 09:12

75

This code works for me:

function load() {
    var channels = "";
    var keywords = "";
    chrome.storage.local.get('channels', function (result) {
        channels = result.channels;
        alert(result.channels);
        $("#channels").val(channels);
    });
}

Chrome.storage.local.get() returns an object with items in their key-value mappings, so you have to use the index of the key in your search pattern.

IMP:

Thanks to Rob for identifying: Chrome.storage.local.get() is asynchronous, you should modify your code to ensure they work after callback() is successful.

Let me know if you need more information.

edited Jun 20 '20 at 09:12

Community

1
1

answered Dec 14 '12 at 05:35

Sudarshan

18,140
7
53
61

Can a single code block be used to return all keys? – Volatil3 May 14 '16 at 02:45
Better to declare variables in callback function instead of declaring them globally. Just saying :) – Mr. Alien Jun 08 '16 at 16:38

score 6 · Answer 2 · answered Dec 14 '12 at 05:28

6

debug or use

alert(JSON.stringify(result));

for more details as to what you are getting back

answered Dec 14 '12 at 05:28

7zark7

10,015
5
39
54

1

console.dir(result); will also do this. – CodingInTheUK Jun 13 '17 at 00:20

score 2 · Answer 3 · answered Oct 10 '16 at 15:19

2

The "result" value you are using is an object that contains the storage value, to get the value you have to use result.keywords, which will get the value of the keywords. EX:

function load(){
  chrome.storage.local.get('keywords', function(result){
    var keywords = result.keywords;
    alert(keywords);
  });

  chrome.storage.local.get('channels', function(result){
    var channels = result.channels;
    alert(channels);
  });
}

answered Oct 10 '16 at 15:19

Mdbook

41
2
6

2

Doesn't deal with the main problem of using `keywords` later in the code, but before the callback runs. – Xan Oct 10 '16 at 16:50

chrome.storage.local.get and set

3 Answers3

IMP:

Linked

Related