Comment afficher le stockage d’une extension Chrome que j’ai installée?

Il semble qu’il soit possible de voir le localStorage / chrome.storage des extensions Chrome installées sur mon navigateur. J’ai un peu joué avec les outils de développement, mais je n’ai pas trouvé le moyen de le faire. Des idées?

Il existe une extension très utile pour travailler avec localStorage et chrome.storage que j’ai récemment découvert, qui fonctionne comme un panneau Outils de développement.

Explorateur de zone de stockage

entrer la description de l'image ici

Je n’ai pas écrit ceci, mais l’auteur a suggéré une autre question SO.

Je vais procéder à la fusion des connaissances existantes présentes dans plusieurs réponses, dans un format simple et complet. Si vous votez pour celui-ci, faites de même avec ceux de @mwkwok et @chaohuang.

Il est vrai que les éléments enregistrés avec chrome.storage ne s’affichent pas dans les outils de développement, vous ne pouvez voir que les éléments enregistrés à l’aide de l’API localStorage. Faites ceci:

  1. Ouvrez la page d’arrièreplan de votre extension en accédant à chrome://extensions/ (le “mode développeur” doit être vérifié pour voir les pages d’arrière-plan)

  2. Accédez à l’onglet Console et tapez ceci:

chrome.storage.local.get(function(result){console.log(result)})

Cela va cracher l’intégralité du stockage en tant qu’object JSON dans la console.

Vous avez raison de dire que chrome.storage ne s’affiche pas dans les outils de développement. Le seul moyen que j’ai trouvé pour voir tout cela est de le mettre dans la console:

 chrome.storage.local.get(function(result){console.log(result)}) 

Cela va cracher l’object JSON dans la console.

Ouvrez le Chrome Devtool en cliquant sur la page d’arrière-plan d’une extension dans Chrome://extensions/ (le Developer mode doit être vérifié pour voir les pages d’arrière-plan), puis dans le panneau des ressources, vous pouvez voir le stockage local sur la gauche.

Je n’ai obtenu aucun résultat en utilisant le code fourni saisi dans la console. Mais ce code a fonctionné quand mis dans la console.

chrome.storage.sync.get(null, function (data) { console.info(data) });

La différence ici est que nous transmettons une valeur nulle qui renverra tout le contenu du stockage. Pour cela, et pour des lectures supplémentaires, consultez la page chrome officielle de cette API.

C’était en fait deux questions!

  1. Comment visualiser localStorage d’une extension Chrome que j’ai installée?

Ouvrez le Chrome Devtool en cliquant sur la page d’arrière-plan d’une extension dans Chrome: // extensions / (le mode développeur doit être vérifié pour voir les pages d’arrière-plan), puis dans le panneau des ressources, vous pouvez voir le stockage local sur la gauche. (par chaohuang et Kil)

  1. Comment visualiser chrome.storage d’une extension Chrome que j’ai installée?

Dans la même console de la page d’arrière-plan:

  • Pour storage.local (par mwkwok)

chrome.storage.local.get(function(result){console.log(result)})

  • Pour storage.sync

chrome.storage.sync.get(function(result){console.log(result)})