Chrome Content Scripts: Save to database

Question

So I am making a pretty simple Chrome content script (or should be if it's allowed).

So I want to be able to save certain things on a webpage for future reference. So for example, say I go to quora and search for something. I want to be able to hold onto that query for, say, a the next few webpages the user goes to. I was thinking if I could save values to a database from a content script that would work, if not just a simple way to save it in a cookie or something could work.

Any thoughts? Is this possible with a content script?

Answer 1

localStorage

There's a special API to store small amounts of data in browser called localStorage. It is very useful to store key-value pairs.

localStorage["key1"] = "value1";
console.log(localStorage["key1"]); // value1

The point is that localStorage is similar to cookies in terms of data persistence. This means you can get saved data even after you exit the browser.

Nice read about localStorage: http://diveintohtml5.info/storage.html.

chrome.storage (best way for you)

Actually, Chrome has its own analogue of localStorage. It's called chrome.storage API. If you use content script, I think this is the best way for you. The point is that your content script can directly access data, there's no need of background page. And it also should be mentioned that you can store objects using chrome.storage (localStorage stores only strings).

As usual, there's a nice documentation from Google for its API: http://developer.chrome.com/extensions/storage.html

IndexedDB

If you need to store big amounts of data, the best way to do it is to utilize browser databases, such as IndexedDB or Web SQL (Alert! Web SQL is deprecated since 2010).

Read more about IndexedDB: https://developer.mozilla.org/en/docs/IndexedDB http://www.html5rocks.com/en/tutorials/indexeddb/todo/

More about Web SQL: http://html5doctor.com/introducing-web-sql-databases/