美文网首页
Local Storage

Local Storage

作者: 是刘快啊 | 来源:发表于2018-06-02 01:50 被阅读0次

    Local Storage是html5提供的API,实质上是一个哈希表。
    Session是服务器上的哈希表,Local Storage是浏览器上的哈希表。

    存值:.setItem()

    localStorage.setItem('a', '1')
    localStorage.setItem('b', '2')
    localStorage.setItem('jsonString', JSON.stringify({name: 'obj'})) //localStorage只能存字符串
    

    取值:.getItem()

    localStorage.getItem('a') //"1"
    localStorage.getItem('b') //"2"
    localStorage.getItem('jsonString') //"{"name": "obj"}"
    

    清空Local Storage:localStorage.clear()

    这些API都是在操作页面上的一个哈希。

    对Windows系统来说,Local Storage存在c盘的一个文件里,持久化存储。
    如果没有Local Storage,每次刷新页面,所有变量全部销毁。

    Local Storage最典型应用:记录下有没有提醒过用户

    let already = localStorage.getItem('已经提示了')
    if(!already){
        alert('你好,我们网站改版了,有了这些新功能:……')
        localStorage.setItem('已经提示了', true)
    }else {
        //什么也不做
    }
    

    Local Storage

    1. Local Storage跟HTTP无关
    2. HTTP不会带上Local Storage的值
    3. 只有相同域名的页面才能互相读取Local Storage(没有同源那么严格)
    4. 每个域名Local Storage最大存储量为5MB左右(每个浏览器不一样)
    5. 常用场景:巨鹿有没有提示过用户(不敏感信息,不能记录密码)
    6. Local Storage永久有效,除非用户清理缓存

    Session Storage(会话存储)与Local Storage API一样
    1234点同上

    1. Session Storage在用户关闭页面(绘画结束)后就失效。

    Session Storage(会话存储)与服务器上的Session无关。


    Cookie是HTTP协议的一个内容,
    Local Storage是html5提供的API,
    两者没什么关系,为什么经常有人把它们放在一起比较?
    这是有历史原因的。
    Local Storage是新API,之前的前端要做到跨页面持久存储只能用Cookie (Cookie也是存在c盘的一个文件里)。
    但是用Cookie存数据有一个问题:所有写在Cookie上的数据每次请求都会带到服务器,导致请求变慢。
    所以现在前端永远不要读/写Cookie,正常来说由后端写/读Cookie。

    相关文章

      网友评论

          本文标题:Local Storage

          本文链接:https://www.haomeiwen.com/subject/yerlsftx.html