使用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 相关文章推荐
Jquery中增加参数与Json转换代码
Nov 20 Javascript
广泛收集的jQuery拖放插件集合
Apr 09 Javascript
一个不错的js html页面倒计时可精确到秒
Oct 22 Javascript
node.js中的fs.write方法使用说明
Dec 15 Javascript
jQuery中Ajax的load方法详解
Jan 14 Javascript
javascript数组去重方法汇总
Apr 23 Javascript
js实现点击图片自动提交action的简单方法
Oct 16 Javascript
AngularJS 异步解决实现方法
Jun 12 Javascript
10分钟上手vue-cli 3.0 入门介绍
Apr 04 Javascript
Node.js net模块功能及事件监听用法分析
Jan 05 Javascript
如何在JavaScript中谨慎使用代码注释
Jun 21 Javascript
vue中el-input绑定键盘按键(按键修饰符)
Jul 22 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
解析php下载远程图片函数 可伪造来路
2013/06/25 PHP
在Mac OS上编译安装Nginx+PHP+MariaDB开发环境的教程
2016/02/23 PHP
XHProf报告字段含义的解析
2016/05/17 PHP
jquery之Document元素选择器篇
2008/08/14 Javascript
EXTJS内使用ACTIVEX控件引起崩溃问题的解决方法
2010/03/31 Javascript
jQuery筛选器children()案例详解(图文)
2013/02/17 Javascript
鼠标经过子元素触发mouseout,mouseover事件的解决方案
2015/07/26 Javascript
基于jQuery 实现bootstrapValidator下的全局验证
2015/12/07 Javascript
xmlplus组件设计系列之路由(ViewStack)(7)
2017/05/02 Javascript
vue做移动端适配最佳解决方案(亲测有效)
2018/09/04 Javascript
在Vue项目中,防止页面被缩放和放大示例
2019/10/28 Javascript
vuex+axios+element-ui实现页面请求loading操作示例
2020/02/02 Javascript
[48:32]2018DOTA2亚洲邀请赛 3.31 小组赛 A组 LGD vs VG
2018/04/01 DOTA
Python使用PyGreSQL操作PostgreSQL数据库教程
2014/07/30 Python
python基于phantomjs实现导入图片
2016/05/13 Python
Python制作钉钉加密/解密工具
2016/12/07 Python
python 读取DICOM头文件的实例
2018/05/07 Python
浅谈python连续赋值可能引发的错误
2018/11/10 Python
详解python tkinter教程-事件绑定
2019/03/28 Python
Python Scrapy框架:通用爬虫之CrawlSpider用法简单示例
2020/04/11 Python
使用Nibabel库对nii格式图像的读写操作
2020/07/01 Python
HTML5 canvas实现雪花飘落特效
2016/03/08 HTML / CSS
高清屏中使用Canvas绘图出现模糊的问题及解决方法
2019/06/03 HTML / CSS
方太官方网上商城:销售方太抽油烟机、燃气灶、消毒柜等
2017/01/17 全球购物
Foot Locker澳洲官网:美国运动服和鞋类零售商
2019/10/11 全球购物
.NET笔试题(20个问题)
2016/02/02 面试题
建设工地安全标语
2014/06/07 职场文书
微笑服务标语
2014/06/24 职场文书
敬老院标语
2014/06/27 职场文书
聘用意向书
2014/07/29 职场文书
四风问题原因分析及整改措施
2014/10/24 职场文书
期末考试复习计划
2015/01/19 职场文书
2015年财务部工作总结
2015/04/10 职场文书
拾金不昧表扬稿大全
2015/05/05 职场文书
Nginx+Tomcat实现负载均衡、动静分离的原理解析
2021/03/31 Servers
Python函数中apply、map、applymap的区别
2021/11/27 Python