首页
学习
活动
专区
圈层
工具
发布

JavaScript localStorage 的使用

使用上的好处在于大部分浏览器都有支持、可以存储数据的容量大多有 5MB 以上、且数据存储和提取相对简单方便。...两种不同的 web storage 对象localStorage:可以跨浏览器分页使用、用户关掉分页或浏览器再打开数据仍不会消失,且数据无有效期限制,数据将永久被保留。...数据存储的格式数据是以类似 JSON 的 Key-value pair 格式存储key 和 value 皆需要为字符串如何使用存储数据:setItem()localStorage.setItem(key...查看存储的数据内容,可以发现这次的格式和预期的相同:当我们要取出数据时,使用 JSON.parse() 方法,将数据转换回原本的格式:总结--开发web应用程序时,若需要将数据存取下来,在往后或离线时使用...,一个简单的方式就是通过 localStorage 和 sessionStorage 的应用 — 不仅容量在大多浏览器都达 5MB 以上,且可以将数据存储在本地客户端直接使用,简单且方便;然而,数据格式的转换是使用上特别需要注意的地方

46500
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    vue中使用localStorage存储信息

    一、什么是localStorage 对浏览器来说,使用 Web Storage 存储键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:localStorage 和 sessionStorage...,数据依然会一直存在 所以上次使用cookie的时候就遇到了一个坑,设置后马上访问session会获取不到,蛋疼,还需要刷新一下,原因是: 当我们首次访问设置Cookie的页面时,服务器会把设置的Cookie...二、使用方法 注意:sessionStorage 和 localStorage 的用法基本一致,引用类型的值要转换成JSON,所以这里就只列举localStorage 保存 //对象 const info...;   var data2 = localStorage.getItem('zheng'); 删除 //删除某个localStorage.removeItem('hou'); //删除所有localStorage.clear...localStorage是window上的。所以不需要写this.localStorage,vue中如果写this,是指vue实例。

    3.5K10

    如何安全使用localStorage保护敏感数据

    localStorage让你担忧?以下是锁定它的方法一直在localStorage中存储敏感数据,认为它既安全又方便?其实不然。一个错误就可能暴露一切:用户令牌、私钥等等。...在localStorage中存储敏感数据就像把家门钥匙放在门垫下——容易获取,但随时可能引发灾难。为什么localStorage是个陷阱localStorage看似完美——浏览器中简单的键值存储。...它们只需一行代码就能读取localStorage。...// 恶意扩展代码const observer = new MutationObserver(() => { // 获取所有localStorage数据 const data = { ...localStorage...const secureStore = { async encrypt(data) { // 使用Web Crypto API生成唯一加密密钥 const key = await crypto.subtle.generateKey

    33200

    localStorage 的相关运用

    localStorage 是浏览器自带的一个属性,只读的localStorage 属性允许你访问一个Document 源(origin)的对象 Storage;存储的数据将保存在浏览器会话中。...localStorage 类似 sessionStorage,但其区别在于:存储在 localStorage 的数据可以长期保留;而当页面会话结束——也就是说,当页面被关闭时,存储在 sessionStorage...应注意,无论数据存储在 localStorage 还是 sessionStorage ,它们都特定于页面的协议。 另外,localStorage 中的键值对总是以字符串的形式存储。...(需要注意,和 js 对象相比,键值对总是以字符串的形式存储意味着数值类型会自动转化为字符串类型). localStorage 的使用也非常简单,分为存入和读取,可以将其绑定在事件方法中。...// 清除本地存储中的所有值 localStorage.clear(); // 本地存储中删除特定项 localStorage.removeItem(key);

    59210
    领券