0

尝试构建一个简单的 Chrome 扩展来输出 localStorage 的全部内容。

应该有多难？花了几个小时研究和尝试，仍然不起作用:(

感谢帮助！

例如：

function load() {
    chrome.storage.local.get(null, function(items) {
    var allKeys = Object.keys(items);
    alert(allKeys.count);
  });
}
document.addEventListener('DOMContentLoaded', () => {
  load();
});

输出“未定义”

我尝试的其他一些方法实际上包含了一个对象，但我无法对它做任何事情（没有计数/长度，没有 JSON.stringify，没有 toString() 等）。

显现：

"permissions": [
    "activeTab",
    "storage",
    "tabs",
    "http://*/*",
    "https://*/*",
    "chrome://favicon/"
  ]

如何在我的扩展弹出窗口中输出整个 localStorage？

请帮忙！

4

2 回答 2

2

要显示当前活动选项卡的 localStorage，请尝试：

chrome.tabs.executeScript({code:'JSON.stringify(localStorage)'},function(result) {
    console.log(JSON.parse(result[0]));
});

工作示例：

popup.html

<body>
    <div id=ls></div>
    <script src="popup.js"></script>
</body>

popup.js

chrome.tabs.executeScript({code:'JSON.stringify(localStorage)'}, res => {
    var ls = document.querySelector("#ls"), lsObj = JSON.parse(res[0]), lsHtml = "";
    for (var key in lsObj)
        lsHtml += "<p>" + key + " : " + lsObj[key] + "</p>";
    ls.innerHTML = lsHtml ? lsHtml : "The active tab has nothing in localStorage";
});
于 2018-01-31T14:55:19.707 回答
2

你能试试allKeys.length吗？

Object.keys(items)会给你一个数组。默认情况下，数组没有属性count。我想你的意思是length。

如果您需要网页的本地存储（标签中加载的域），而不是扩展页面的本地存储，我认为您不能这样做。

Iván Nokonoko提出了一个很好的观点，即您需要注入脚本才能与加载的网页进行交互，但问题是注入的脚本被迫在隔离环境中运行，在该环境中您只能访问 DOM 树，但无法访问原始 JS 环境，因此localStorage您可以获得的变量是您自己隔离环境中的变量，而不是原始变量。

引自Chrome 内容脚本 API：

但是，内容脚本有一些限制。他们不能：

  • 使用由网页或其他内容脚本定义的变量或函数

而且我相信注入代码与内容脚本具有相同的限制。

我认为这个限制是出于安全考虑。将 DOM 树暴露给扩展是可以的，在最坏的情况下扩展会弄乱视图。但是如果将 JS 环境暴露给扩展，例如本地存储，那么它可能是危险的，因为扩展能够访问/篡改数据。

于 2018-01-31T13:59:37.143 回答