如何查看已安装的 Chrome 扩展程序的存储空间？

Posted 2023-03-05

【中文标题】如何查看已安装的 Chrome 扩展程序的存储空间？

【英文标题】：How do I view the storage of a Chrome Extension I've installed?

【发布时间】：2012-08-09 00:18:44

【问题描述】：

似乎应该可以查看安装在我的浏览器上的 Chrome 扩展程序的 localStorage/chrome.storage。我已经玩过开发者工具了一点，但还没有找到一种方法来做到这一点。有什么想法吗？

【参考方案1】：

在 2022 年，我发现的最佳方法仍然是使用 console.log，但您可以通过柯里化使其看起来更简洁。打开扩展页面，打开后台工作人员的检查器，转到控制台，然后...

chrome.storage.local.get(console.log)

【参考方案2】：

这实际上是两个问题！

如何查看我已安装的 Chrome 扩展程序的 localStorage？

在Chrome://extensions/中点击扩展的后台页面打开Chrome Devtool（需要勾选开发者模式才能看到后台页面），然后在资源面板中可以看到左侧的本地存储。 (by chaohuang and Kil)

如何查看我已安装的 Chrome 扩展程序的 chrome.storage？

在后台页面的同一个控制台中：

首先打开背景页面：

一个。去 chrome://extensions/

b.确保您处于开发模式

c。然后在您的扩展程序上，单击“检查视图背景页面”或转到“详细信息”并单击背景页面。

现在您已进入后台页面，您可以继续：

用于 storage.local（作者 mwkwok）

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

用于 storage.sync

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

【讨论】：

应该被接受为正确答案，下面的答案需要安装附加组件并且不起作用。

使用 Chrome 80 在控制台中尝试使用 chrome.storage.local.get 时出现以下错误：未捕获的类型错误：无法在 :1:16 读取未定义的属性“本地”。 chrome.storage 值在控制台中未定义。

@suma 你在普通页面的控制台里试过了吗？

我现在明白了。我需要打开背景页面，如答案中所述。对于像我这样不知道它是什么的天真用户来说，也许答案可能包括如何导航到背景页面。

@Suma 这样做的方法是转到chrome://extensions/，确保您处于开发模式，然后在您的扩展程序上，单击“检查视图背景页面”或转到“详细信息”并点击背景页面。然后你就可以访问你的变量了。

【参考方案3】：

我最近发现了一个非常有用的扩展程序，可以与 localStorage 和 chrome.storage 一起使用，它可以用作开发工具面板。

Storage Area Explorer

这不是我写的，而是作者在其他一些 SO 问题上建议的。

【讨论】：

希望我能 +50 这个。

我试过了，但它不适合我。然而，我实际上是在开发一个 Chrome “devtools”扩展——而不是一个普通的 Chrome 扩展。

@nogridbag 尝试为您的开发工具打开开发工具。取消停靠，Ctrl+Shift+I。 ..等等，我试过了。如果您患有癫痫症，请勿使用 Storage Area Explorer 执行此操作！

现在好像坏了。

效果很好！ （在开发中使用我自己的未打包扩展进行了测试）

【参考方案4】：

使用输入控制台提供的代码，我没有得到任何结果。但是这段代码在放入控制台时有效。

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

这里的区别是我们传递了一个空值，它将返回存储中的所有内容。要支持这一点并进行更多阅读，请查看official chrome page on this API.

【参考方案5】：

我将继续将几个答案中存在的现有知识合并为一个简单而全面的答案。 如果你投了这个票，请给@mwkwok 和@chaohuang 投同样的票。

确实，使用chrome.storage 保存的内容不会显示在开发人员工具中，您只能看到使用常规 localStorage API 保存的内容。这样做：

转到chrome://extensions/，打开扩展程序的后台页面（需要选中“开发者模式”才能查看后台页面）

转到Console 标签并输入：

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

这会将整个存储作为 JSON 对象吐到控制台中。

【讨论】：

稍短的等价物是chrome.storage.local.get(console.log)。还有chrome.storage.sync.get(console.log)！

它说storage 未定义

【参考方案6】：

你说得对，chrome.storage 没有出现在开发者工具中。我发现查看所有内容的唯一方法是将其放入控制台：

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

这会将 JSON 对象吐出到控制台中。

【讨论】：

它说storage 未定义

【参考方案7】：

在Chrome://extensions/中点击扩展的背景页面打开Chrome Devtool（需要勾选Developer mode才能看到背景页面），然后在资源面板中可以看到左侧的本地存储。

【讨论】：

如果你使用LocalStorage API，你可以在Chrome开发者工具中找到它。但如果你使用chrome.storage API 方法如chrome.storage.local.set("key":value)，数据不会存储在那里。我们在哪里可以找到这些数据？

没有看到我的扩展保存的任何内容。除了打印出来，还有其他方法可以查看吗？

查看@Xan 最近添加的答案。

这还能用吗？ 你看到的是 html5 存储，而不是 chrome.storage 存储

什么都看不到