how to access IndexedDB (of current opened domain/tab) from chrome extension

Question

I currently have indexedDB on google.com domain. i want to be able to read it from google chrome extension. how can i accomplish this? do i need to add any specific permissi

Answer 1

To access indexeddb of current tab add "activeTab" to "permissions" tag in manifest.json, Then create a content script, content script will be helpful in accessing the indexeddb as it runs in context of webpages, then add the content script created to the "content_scripts" tag in manifest.json file. For Eg in manifest.json add the following:

"permissions": ["activeTab"],
  "content_scripts": [
  {
  "matches": ["add the domains of the webpages where content script needs to run"],
  "js": ["contentScript.js"]
  }
]

For more info on matches check out here:https://developer.chrome.com/extensions/match_patterns .

Inside content script add open the store and then perform transaction on the object store and perform queries on the object store. For Eg in content script add following:

if (!("indexedDB" in window)) {
  alert("This browser doesn't support IndexedDB");
 } else {
  let indexdb = window.indexedDB.open("firebaseLocalStorageDb", 1);
  indexdb.onsuccess = function() {
  let db = indexdb.result;
  let transaction = db.transaction("firebaseLocalStorage", "readwrite");
  let storage = transaction.objectStore("firebaseLocalStorage");
  console.log(storage.getAll());
 };
}

Explanation of the above code: It accesses the window object and opens the store "firebaseLocalStorageDb" with version "1", then after successfully accessing the object it looks for the result and performs transaction on the objectstore "firebaseLocalStorage" residing inside the store. Finally query the instance of objectstore "storage" to get all the key-value pairs. For more info check: https://javascript.info/indexeddb

Answer 2

For anyone still interested, my solution to this problem -

this is placed in content script of extension -

 chrome.extension.onConnect.addListener(function(port) {
 if(port.name == "extension_request" ) {
  port.onMessage.addListener(function(msg) {
    if (msg.db) {
      window.indexedDB.webkitGetDatabaseNames().onsuccess = function(sender,args)
      {
        var r = sender.target.result;
        if(r.contains(msg.db)){
            var openRequest = indexedDB.open(msg.db);
            // your code
            port.postMessage({foo: bar}); // your result which you want to send        
        }
       }
    }
 }
}

and this is for background or popup script -

 chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
        var port = chrome.tabs.connect(tabs[0].id,{name: "extension_request"});
            port.postMessage({db: "database_name_example"}); // send database name
            port.onMessage.addListener(function(msg) {
              if (msg.foo ) {
               // do your stuff in extension
              }
           }
}