Javascript 跨页面存储信息

Question

我一直在尝试使用 sessionStorage 跨页面保存 javascript 个变量。

据我了解，语法是：

sessionStorage.setItem('whateverkey', 'whatever value');

有没有办法在 sessionStorage 中保存变量，或者其他跨页面保存信息的简单方法

提前致谢！

Answer 1

sessionStorage用于存储一个page/tab的数据，一旦关闭它，数据就丢失了，如果你打开另一个具有相同域的标签，你将有一个新的实例sessionStorage 干净。

您想要的是使用 localStorage，它适用于所有选项卡（具有相同域）。

sessionStorage maintains a separate storage area for each given origin that's available for the duration of the page session (as long as the browser is open, including page reloads and restores).

localStorage does the same thing, but persists even when the browser is closed and reopened. Source.

Answer 2

My value is 'null' when I try to access it from another page.

这是exactly how sessionStorage is designed to work:

The sessionStorage property allows you to access a session Storage object. sessionStorage is similar to Window.localStorage, the only difference is while data stored in localStorage has no expiration set, data stored in sessionStorage gets cleared when the page session ends. A page session lasts for as long as the browser is open and survives over page reloads and restores. Opening a page in a new tab or window will cause a new session to be initiated, which differs from how session cookies work.

如果您希望您的数据在同一来源的多个页面中持续存在，请改用 localStorage。

Answer 3

可以保存字符串和整数，不能保存对象。但是，您可以序列化并保存 JSON.

localStorage用于永久存储数据，而sessionStorage只是暂时存储数据，直到用户关闭网络浏览器。

您使用的语法是正确的。您使用 setItem 存储并使用 getItem 加载。

示例：

localStorage.setItem('name', 'Alice');
localStorage.setItem('marbles', 22);
localStorage.setItem('admin', true);

或：

var animal = {"type": "cat", "food": "catfood"};
localStorage.setItem('animal', JSON.stringify(animal));

那你就可以得到了：

var json = localStorage.getItem('animal');
var animal = JSON.parse(json);

Javascript 跨页面存储信息

Javascript storing information across pages

javascript

session-storage