javascript-使用localStorage代替Cookies是否有任何弊端?

在以前的网站上,我曾经使用cookie来仅在第一次访问时显示主页。 效果很好(例如,请参见此处),但是今天使用cookie并不流行,因此我想尽可能避免使用它。

现在,我的新网站项目几乎总是通过javascript(显示一个模式框)启动了pre-home,因此我不需要在服务器端执行任何操作。 我正在考虑使用HTML5 localStorage代替cookie,如果浏览器没有localStorage,则使用cookie的备用。 这是一个好主意吗? 在可用性,隐私保护和网站性能方面有什么影响?

使用localStorage将提高禁用cookie的用户的可用性。 但我知道某些浏览器仅支持部分HTML5功能(例如地理定位)。 在任何浏览器上对localStorage都有类似的限制吗? 如果localStorage可用但我的站点已停用,是否会出现JS错误?

4个解决方案
76 votes

易用性

用户将不知道您使用的是localStorage还是cookie。 如果用户禁用cookie,localStorage也不起作用。

性能

两种方法之间没有明显的速度差异。

sessionStorage

sessionStorage仅适用于该浏览器选项卡的会话。 如果关闭标签,会话将丢失,数据也将丢失,这类似于任何后端语言上的会话变量。

本地存储

localStorage将可用于浏览器中的任何选项卡或窗口,并且将一直存在,直到被用户或程序删除为止。 与Cookie不同,您无法设置有效期限。 localStorage也具有更大的存储限制。

你的问题

  1. 您没有使用此数据服务器端,因此不需要Cookie。 本地cookie永远不会像cookie一样发送到服务器。
  2. 如果用户禁用cookie,localStorage也不起作用。

后备示例

您可以使用Modernizr来验证localStorage是否可用,否则,请使用存储cookie。

if (Modernizr.localstorage) {
    // supports HTML5 Storage :D
} else {
    // does not support HTML5 Storage :(
}

您也可以放弃Modernizr并使用支票typeof Storage !== 'undefined'

Vinícius Moraes answered 2020-06-23T19:50:35Z
29 votes

比较LS和Cookie可以比较苹果和橙子。

Cookies和LS出于不同的目的完全不同。 LS是一种工具,它允许您的客户端(javascript代码)在本地存储其数据,而无需将其传输到服务器。 Cookies是用于客户端与服务器通信的工具。 Cookie的全部要点随每个请求一起发送。

过去,cookie经常被滥用来模拟本地存储,因为这是JavaScript应用程序将任何内容写入客户端硬盘的唯一可能性。 但是LS通常不能替代cookie,因此,如果您需要客户端和服务器都应该读写的内容,请使用cookie,而不是LS。

georg answered 2020-06-23T19:51:05Z
7 votes

要添加一点,与cookie通常共享的跨协议不同,存储遵循同源策略。 因此,站点共享相同的域,但是托管在不同的协议上的站点不会共享存储的数据。

假设您的网站是否需要跨HTTP和https进行操作。 例如,当用户单击“购买链接”时,他们将进入https安全的结帐,那么即使他们共享相同的域,结帐也将无法检索先前存储在http网站上的数据。

Norman Xu answered 2020-06-23T19:51:30Z
0 votes

服务器读取localStorage看起来并不容易。 不过,这可能会派上用场,因为知道您的数据是所有客户端数据,因此可以安全地进行嗅探。

Cookies不能被覆盖,只能添加并读取:

alert(document.cookie);
document.cookie = "nope";
alert(document.cookie);
Isaac answered 2020-06-23T19:51:54Z
translate from https://stackoverflow.com:/questions/16855680/are-there-any-drawbacks-to-using-localstorage-instead-of-cookies