设置:localStorage.setItem("token", JSON.parse(res).data.token);
  获取:that.token = localStorage.getItem('token')
  

一、什么是localStorage、sessionStorage

在HTML5中,新加入了一个localStorage特性,这个特性主要是用来作为本地存储来使用的,解决了cookie存储空间不足的问题(cookie中每条cookie的存储空间为4k),localStorage中一般浏览器支持的是5M大小,这个在不同的浏览器中localStorage会有所不同。

localStorage的写入有三种方法,这里就一一介绍一下

var storage=window.localStorage;
//写入a字段
storage["a"]=;
//写入b字段
storage.a=;
//写入c字段
storage.setItem("c",);
console.log(typeof storage["a"]);
console.log(typeof storage["b"]);
console.log(typeof storage["c"]);

运行后的结果如下:

不知道各位读者有没有注意到,刚刚存储进去的是int类型,但是打印出来却是string类型,这个与localStorage本身的特点有关,localStorage只支持string类型的存储。

localStorage的读取

 var storage=window.localStorage;
//写入a字段
storage["a"]=;
//写入b字段
storage.a=;
//写入c字段
storage.setItem("c",);
console.log(typeof storage["a"]);
console.log(typeof storage["b"]);
console.log(typeof storage["c"]);
//第一种方法读取
var a=storage.a;
console.log(a);
//第二种方法读取
var b=storage["b"];
console.log(b);
//第三种方法读取
var c=storage.getItem("c");
console.log(c);

这里面是三种对localStorage的读取,其中官方推荐的是getItem\setItem这两种方法对其进行存取

参考:https://www.cnblogs.com/st-leslie/p/5617130.html

localStorage(本地存储器)、sessionStorage(会话存储)的更多相关文章

  1. HTML5 sessionStorage会话存储

    sessionStorage 是HTML5新增的一个会话存储对象,用于临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后将会删除这些数据.本篇主要介绍 sessionStorage(会话存储) ...

  2. Token和SessionStorage(会话存储对象)

    sessionStorage数据只在当前标签页共享 存在本地   关闭浏览器后会清除数据(关闭标签页不会清楚) localStorage数据会存在浏览器中  浏览器关了数据也还在 只有清除缓存才会消失 ...

  3. HTML5 LocalStorage 本地存储,刷新值还在

    H5的两种存储技术的最大区别就是生命周期. 1. localStorage是本地存储,存储期限不限: 2. sessionStorage会话存储,页面关闭数据就会丢失. 使用方法: localStor ...

  4. 关于HTML5本地缓存技术LocalStorage 本地存储 和 SessionStorage

    如果你想在用户访问的时候记录或者记住他们的行为,你会想到的是什么,cookie 和session.但今天告诉你还有两种或者说是1种吧 那就是html5的 LocalStorage 本地存储和 Sess ...

  5. 轻松实现localStorage本地存储

    相信大家都知道HTML5提供了localStorage和sessionStorage两个新功能,基于这两个功能我们可以实现web资源的离线和会话存储,如果你现在还在用Cookie来临时存储网络资源的话 ...

  6. Web存储使用详解(本地存储、会话存储)

    Web存储使用详解(本地存储.会话存储)1,Web存储介绍HTML5的Web存储功能是让网页在用户计算机上保存一些信息.Web存储又分为两种:(1)本地存储,对应 localStorage 对象.用于 ...

  7. HTML5 localStorage本地存储

    介绍 localStorage(本地存储)的使用方式.包括对存储对象的添加.修改.删除.事件触发等操作. 目录 1. 介绍 1.1 说明 1.2 特点 1.3 浏览器最小版本支持 1.4 适合场景 2 ...

  8. HTML5 LocalStorage 本地存储

    HTML5 LocalStorage 本地存储 说到本地存储,这玩意真是历尽千辛万苦才走到HTML5这一步,之前的历史大概如下图所示: 最早的Cookies自然是大家都知道,问题主要就是太小,大概也就 ...

  9. (转载)HTML5 LocalStorage 本地存储

    原文地址:http://www.cnblogs.com/xiaowei0705/archive/2011/04/19/2021372.html HTML5 LocalStorage 本地存储 说到本地 ...

随机推荐

  1. LeetCode 521 Longest Uncommon Subsequence I 解题报告

    题目要求 Given a group of two strings, you need to find the longest uncommon subsequence of this group o ...

  2. tarjan代码

    还有五天就是NOIP2018了……本蒟蒻还要复习期中考试,因此实在没有时间写博客了(各种找借口).这里就放一下代码 //Tarjan缩点 //题目描述:给一个有向图.每个点有一个权值,求权值和最大的路 ...

  3. 解决Windows下文件在Linux下打开出现乱码的问题

    目录 问题 原理 解决 总结 参考资料 问题 前几天生病了,Java一直在看代码但是没跟着打,于是决定偷一波小小的懒,直接把教材的代码从Windows通过共享文件夹放到了Linux里面.但是编译的时候 ...

  4. #WEB安全基础 : HTTP协议 | 0x7 学会使用wireshark分析数据包

    wireshark是开源,免费,跨平台的抓包分析工具 我们可以通过wireshark学习HTTP报文和进行抓包分析,在CTF中的流量分析需要用到抓包 1.下载和安装 这是wireshark的官网 ht ...

  5. [macOS] Cannot find libz when install php56

    After upgraded to 10.12 and xcode8.2, when updating php with homebrew, i got these errors: /usr/loca ...

  6. angular+webpack(二)

    上篇文章Angular2开发基础之TSC编译 解决如何使用TSC来编译ng2项目,以及如何解决出现的error.这些点是新手容易忽视的内容, 要熟悉ng开发的工具链,还是需要掌握其中的重点.本篇文章是 ...

  7. bzoj2880

    打公式好麻烦 QAQ 为了节省时间去复习,原谅我引用一下别人的博客...http://blog.csdn.net/acdreamers/article/details/8542292 #include ...

  8. 忘记mysql密码时对密码进行更改

    第一步:   打开cmd   输入:net stop mysql 第二步:   再打开另一个cmd    输入:mysqld --skip-grant-tables 第三步:   打开第三个cmd  ...

  9. 2019/3/28 wen 继承

  10. Python sqlalchemy orm 多对多外键关联

    多对多外键关联 注:使用三张表进行对应关联 实现代码: # 创建3个表 配置外键关联 # 调用Column创建字段 加类型 from sqlalchemy import Table, Column, ...