使用localStorage替代cookie做本地存储


Posted in Javascript onSeptember 25, 2019

因为cookie存储有限,加上cookie每次都要上传到服务器,浪费了带宽不说,而且伤害了感情。

基于HTML5的localStorage可能能给你带的新的希望,而且最大支持不超过5MB的数据存储。可惜的是,IE方面只支持IE8以上的版本。

使用localStorage替代cookie做本地存储

我花了一点时间就最近浏览记录的存储简单的写了一个javascript代码来做演示

late = {
 storage : {},
 isinit : 0,
 maxnum : 10,
 key : 'vestigial',
 _init:function(){
  if (late.isinit === 1) {
   return true;
  } else if (late.isinit === 0 && window.localStorage) {
   late.isinit = 1;
   late.storage = window.localStorage;
   return true;
  } else {
   return false;
  }
 },
 
 get:function(){
  if(late._init()){
   var data = late.storage.getItem(late.key);
   return JSON.parse(data);
  }else{
   return false;
  }
 },
 
 set:function(value){
  if(late._init()){
   var data = late.storage.getItem(late.key); 
   data = JSON.parse(data);
   if(data === null){
    data = [];
   }
   if (data.length === 10) {
    data.shift();
   }
   data.push(value);
   data = JSON.stringify(data);
   late.storage.setItem(late.key, data);
   return true;
  }else{
   return false;
  }
 }
};
 
var obj = {
  id:2, 
  title:'标题1', 
  url:'http://www.baidu.com'
 };
late.set(obj);
var each = late.get();
var eachlength = each.length;
for(i=0; i<eachlength; i++){
 document.writeln(JSON.stringify(each[i]));
}

实在不行的话还可以使用flash来存储,不建议使用cookie。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
从数据结构分析看:用for each...in 比 for...in 要快些
Apr 17 Javascript
不使用浏览器运行javascript代码的方法
Jul 24 Javascript
js模拟hashtable的简单实例
Mar 06 Javascript
javascript适合移动端的日期时间拾取器
Nov 10 Javascript
AngularJS中监视Scope变量以及外部调用Scope方法
Jan 23 Javascript
javascript实现在网页中运行本地程序的方法
Feb 03 Javascript
Angularjs中UI Router的使用方法
May 14 Javascript
css和js实现弹出登录居中界面完整代码
Nov 26 Javascript
vue中前进刷新、后退缓存用户浏览数据和浏览位置的实例讲解
Sep 21 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
Apr 25 Javascript
简述vue-cli中chainWebpack的使用方法
Jul 30 Javascript
vue实现一个获取按键展示快捷键效果的Input组件
Jan 13 Vue.js
JavaScript使用localStorage存储数据
Sep 25 #Javascript
Vue路由守卫之路由独享守卫
Sep 25 #Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
Sep 25 #Javascript
Vue利用Blob下载原生二进制数组文件
Sep 25 #Javascript
layui实现图片虚拟路径上传,预览和删除的例子
Sep 25 #Javascript
layui添加动态菜单与选项卡 AJAX请求的例子
Sep 25 #Javascript
IE11下CKEditor在Bootstrap Modal中下拉问题的解决
Sep 25 #Javascript
You might like
PHP的简易冒泡法代码分享
2012/08/28 PHP
Win7下手动安装apache2.2、php5.4笔记
2015/04/03 PHP
Javascript常用运算符(Operators)-javascript基础教程
2007/12/14 Javascript
window.location.hash 使用说明
2010/11/08 Javascript
js判断上传文件的类型和大小示例代码
2013/10/18 Javascript
js style动态设置table高度
2014/10/21 Javascript
JS实现网页Div层Clone拖拽效果
2015/09/26 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
Vue.js每天必学之方法与事件处理器
2016/09/06 Javascript
BootStrap表单控件之文本域textarea
2017/05/23 Javascript
vue的无缝滚动组件vue-seamless-scroll实例
2017/12/18 Javascript
vue+webpack中配置ESLint
2018/11/07 Javascript
vue+element创建动态的form表单及动态生成表格的行和列
2019/05/20 Javascript
Angular 中使用 FineReport不显示报表直接打印预览
2019/08/21 Javascript
vue 实现模糊检索并根据其他字符的首字母顺序排列
2019/09/19 Javascript
javascript实现拼图游戏
2021/01/29 Javascript
python使用正则表达式检测密码强度源码分享
2014/06/11 Python
python自动化脚本安装指定版本python环境详解
2017/09/14 Python
详解python中的hashlib模块的使用
2019/04/22 Python
Python MySQLdb 执行sql语句时的参数传递方式
2020/03/04 Python
Python中random模块常用方法的使用教程
2020/10/04 Python
Django websocket原理及功能实现代码
2020/11/14 Python
python通过cython加密代码
2020/12/11 Python
HTML5之SVG 2D入门5—颜色的表示及定义方式
2013/01/30 HTML / CSS
FILA德国官方网站:来自意大利的体育和街头服饰品牌
2019/07/19 全球购物
css animation配合SVG制作能量流动效果
2021/03/24 HTML / CSS
技术经理的自我评价范文
2013/12/03 职场文书
一岗双责责任书
2014/04/15 职场文书
厉行勤俭节约倡议书
2014/05/16 职场文书
如何写辞职书
2015/02/26 职场文书
高一语文教学反思
2016/02/16 职场文书
小学三年级作文之写景
2019/11/05 职场文书
Python爬虫中urllib3与urllib的区别是什么
2021/07/21 Python
为什么MySQL分页用limit会越来越慢
2021/07/25 MySQL
Springboot-cli 开发脚手架,权限认证,附demo演示
2022/04/28 Java/Android
PYTHON基于Pyecharts绘制常见的直角坐标系图表
2022/04/28 Python