如何使用Firefox扩展获取网页的本地存储

Question

我正在尝试制作一个浏览器扩展，当我单击一个按钮以将API密钥存储在网站的本地存储中时。我观察到我能够在事件侦听器之外获取API密钥。但是，当我在内部执行时，它总是返回null。有人告诉我，在事件侦听器中，它正在尝试获取浏览器扩展的本地存储，那么我该怎么做才能解决这个问题呢？(我是浏览器扩展的新手(

Javascript:

let id = window.localStorage.getItem("session_id");
console.log(id)

document.addEventListener('DOMContentLoaded', function() {
var api_button = document.getElementById('api_button');
// onClick's logic below:
api_button.addEventListener('click', function() {
id = window.localStorage.getItem("session_id");
alert(id)
});
});

Answer 1

您想要使用存储API来实现这一点。

在您的manifest.json中，您需要storage权限

"permissions": [
"storage"
]

然后在您的扩展码中，您可以使用访问本地存储

browser.storage.local.set({ session_id: 'example' })
browser.storage.local.get('session_id').then((session_id) => {
console.log(session_id)
})