使用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 中的内存泄露模式
Aug 13 Javascript
半角全角相互转换的js函数
Oct 16 Javascript
jquery异步请求实例代码
Jun 21 Javascript
jquery清空textarea等输入框实现代码
Apr 22 Javascript
js制作网站首页图片轮播特效代码
Aug 30 Javascript
详解js的延迟对象、跨域、模板引擎、弹出层、AJAX【附实例下载】
Dec 19 Javascript
详谈js中window.location.search的用法和作用
Feb 13 Javascript
bootstrap常用组件之头部导航实现代码
Apr 20 Javascript
Angular项目从新建、打包到nginx部署全过程记录
Dec 09 Javascript
浅谈es6 javascript的map数据结构
Dec 14 Javascript
Vue.js 时间转换代码及时间戳转时间字符串
Oct 16 Javascript
详解vue移动端项目代码拆分记录
Mar 15 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入门速成教程
2007/03/19 PHP
PHP里的单例类写法实例
2015/06/25 PHP
使用PHP进行微信公众平台开发的示例
2015/08/21 PHP
PHP互换两个变量值的方法(不用第三变量)
2016/11/14 PHP
PHP实现UTF8二进制及明文字符串的转化功能示例
2017/11/20 PHP
PHP实现常用排序算法的方法
2020/02/05 PHP
用javascript实现分割提取页面所需内容
2007/05/09 Javascript
一个用js实现的页内搜索代码
2007/05/23 Javascript
JQuery实现鼠标移动到图片上显示边框效果
2014/01/09 Javascript
jquery使整个div区域可以点击的方法
2015/06/24 Javascript
BootStrap实现鼠标悬停下拉列表功能
2017/02/17 Javascript
JS及JQuery对Html内容编码,Html转义
2017/02/17 Javascript
完美实现js焦点轮播效果(一)
2017/03/07 Javascript
vue使用watch 观察路由变化,重新获取内容
2017/03/08 Javascript
推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
2017/04/21 Javascript
JavaScript字符串_动力节点Java学院整理
2017/06/27 Javascript
[01:05:41]EG vs Optic Supermajor 败者组 BO3 第二场 6.6
2018/06/07 DOTA
Python中的类与对象之描述符详解
2015/03/27 Python
使用Python中PDB模块中的命令来调试Python代码的教程
2015/03/30 Python
详解Python中的array数组模块相关使用
2016/07/05 Python
python中pylint使用方法(pylint代码检查)
2018/04/06 Python
python 利用栈和队列模拟递归的过程
2018/05/29 Python
Python绘制的二项分布概率图示例
2018/08/22 Python
Python基于Dlib的人脸识别系统的实现
2020/02/26 Python
css3 transform 3d 使用css3创建动态3d立方体(html5实践)
2013/01/06 HTML / CSS
巴西男士胡须和头发护理产品商店:Beard
2017/11/13 全球购物
医院护士求职自荐信格式
2013/09/21 职场文书
测量工程专业求职信
2014/02/24 职场文书
公司办公室岗位职责
2014/03/19 职场文书
行政执法作风整顿剖析材料
2014/10/11 职场文书
英语感谢信范文
2015/01/20 职场文书
三十年同学聚会致辞
2015/07/28 职场文书
商业计划书格式、范文
2019/03/21 职场文书
Python基础之Socket通信原理
2021/04/22 Python
解决Springboot PostMapping无法获取数据的问题
2022/05/06 Java/Android
JS前端可扩展的低代码UI框架Sunmao使用详解
2022/07/23 Javascript