使用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 相关文章推荐
JavaScript建立一个语法高亮输入框实现思路
Feb 26 Javascript
jquery 循环显示div的示例代码
Oct 18 Javascript
Jquery跳到页面指定位置的方法
May 12 Javascript
Egret引擎开发指南之视觉编程
Sep 03 Javascript
js通过location.search来获取页面传来的参数
Sep 11 Javascript
Jquery 1.9.1源码分析系列(十二)之筛选操作
Dec 02 Javascript
详解ES6之async+await 同步/异步方案
Sep 19 Javascript
vue2导航根据路由传值,而改变导航内容的实例
Nov 10 Javascript
vue 实现边输入边搜索功能的实例讲解
Sep 16 Javascript
微信小程序云开发使用方法新手初体验
May 16 Javascript
Vue this.$router.push(参数)实现页面跳转操作
Sep 09 Javascript
Ajax实现页面无刷新留言效果
Mar 24 Javascript
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
手把手教你使用DedeCms V3的在线采集图文教程
2007/04/03 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
2016/07/21 PHP
PHP抽象类与接口的区别实例详解
2019/05/09 PHP
详解PHP 7.4 中数组延展操作符语法知识点
2019/07/19 PHP
Laravel 微信小程序后端搭建步骤详解
2019/11/26 PHP
Javascript 读后台cookie代码
2008/09/15 Javascript
JS+XML 省份和城市之间的联动实现代码
2009/10/14 Javascript
关于event.cancelBubble和event.stopPropagation()的区别介绍
2011/12/11 Javascript
php析构函数的具体用法小结
2014/03/11 Javascript
js数组中如何随机取出一个值
2014/06/13 Javascript
微信小程序 icon组件详细及实例代码
2016/10/25 Javascript
Angular2.js实现表单验证详解
2017/06/23 Javascript
vue实现未登录跳转到登录页面的方法
2018/07/17 Javascript
详解关于element el-button使用$attrs的一个注意要点
2018/11/09 Javascript
详解Vue项目部署遇到的问题及解决方案
2019/01/11 Javascript
Jquery属性的获取/设置及样式添加/删除操作技巧分析
2019/12/23 jQuery
javascript中正则表达式语法详解
2020/08/07 Javascript
[02:28]DOTA2英雄基础教程 灰烬之灵
2013/12/19 DOTA
[01:27:44]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Aster BO3 第一场 1月24日
2021/03/11 DOTA
在centos7中分布式部署pyspider
2017/05/03 Python
python 3.5下xadmin的使用及修复源码bug
2017/05/10 Python
Python使用filetype精确判断文件类型
2017/07/02 Python
Flask数据库迁移简单介绍
2017/10/24 Python
Python使用sort和class实现的多级排序功能示例
2018/08/15 Python
解决Mac下首次安装pycharm无project interpreter的问题
2018/10/29 Python
Python 实现Serial 与STM32J进行串口通讯
2019/12/18 Python
网络编程中设计并发服务器,使用多进程与多线程,请问有什么区别?
2016/03/27 面试题
个人自我鉴定
2013/11/07 职场文书
自动化专业职业生涯规划书范文
2014/01/16 职场文书
单位介绍信范文
2014/01/18 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
社区班子对照检查材料
2014/08/27 职场文书
通知的格式范文
2015/04/27 职场文书
Anaconda安装pytorch及配置PyCharm 2021环境
2021/06/04 Python
CSS3实现指纹特效代码
2022/03/17 HTML / CSS
教你nginx跳转配置的四种方式
2022/07/07 Servers