似乎应该可以查看我的浏览器上安装的 Chrome 扩展程序的localStorage
/ 。chrome.storage
我已经玩过开发者工具了一点,但还没有找到一种方法来做到这一点。有任何想法吗?
7 回答
有一个非常有用的扩展可以与两者一起使用localStorage
,chrome.storage
而且我最近发现了它,它可以用作开发工具面板。
我没有写这个,但是作者在其他一些 SO 问题上建议的。
我将继续将几个答案中存在的现有知识合并为一个简单而全面的答案。如果你投票赞成这个,请对来自@mwkwok 和@chaohuang 的投票做同样的事情。
确实,使用保存的内容chrome.storage
不会显示在开发人员工具中,您只能看到使用常规 localStorage API 保存的内容。做这个:
通过转到(需要检查“开发者模式”以查看背景页面)打开扩展程序的背景页面
chrome://extensions/
转到
Console
选项卡并键入:
chrome.storage.local.get(function(result){console.log(result)})
这会将整个存储作为 JSON 对象吐到控制台中。
没错,chrome.storage 没有出现在开发人员工具中。我发现查看所有内容的唯一方法是将其放入控制台:
chrome.storage.local.get(function(result){console.log(result)})
这会将 JSON 对象吐到控制台中。
这其实是两个问题!
- 如何查看已安装的 Chrome 扩展程序的localStorage ?
在 Chrome://extensions/ 中点击扩展的后台页面打开 Chrome Devtool(需要勾选开发者模式才能看到后台页面),然后在资源面板中可以看到左侧的本地存储。(by chaohuang and Kil)
- 如何查看已安装的 Chrome 扩展程序的chrome.storage ?
在后台页面的同一个控制台中:
首先打开背景页面:
一个。去 chrome://extensions/
湾。确保您处于开发模式
C。然后在您的扩展程序上,单击“检查视图背景页面”或转到“详细信息”并单击背景页面。
现在您在后台页面上,您可以继续:
- 对于 storage.local (by mwkwok)
chrome.storage.local.get(function(result){console.log(result)})
- 对于 storage.sync
chrome.storage.sync.get(function(result){console.log(result)})
在 Chrome Devtool 中点击扩展的背景页面Chrome://extensions/
(Developer mode
需要勾选才能看到背景页面),然后在资源面板中可以看到左侧的本地存储。
使用输入控制台的提供的代码,我没有得到任何结果。但是这段代码在放入控制台时有效。
chrome.storage.sync.get(null, function (data) { console.info(data) });
这里的不同之处在于我们传递了一个空值,它将返回存储中的所有内容。要支持这一点并进行更多阅读,请查看此 API 上的官方 chrome 页面。
在 2022 年,我发现最好的方法仍然是使用 console.log,但你可以通过 currying 让它看起来更干净。打开扩展页面,打开后台工作人员的检查器,转到控制台,然后...
chrome.storage.local.get(console.log)