前端数据存储方式

2023-10-27

一、Cookie

cookie 用于存储web页面的用户信息。

cookie 是一些数据,存储在你电脑上的文本文件中。当web服务器向浏览器发送web页面时,在连接关闭后,服务端不会记录用户的信息。Cookie的作用就是用于解决如何记录客户端的用户信息。

  1. 当用户访问web页面时,他的名字记录在cookie中。
  2. 在用户下一次访问该页面时,可以再cookie中读取用户的访问记录。

Cookie以name为名称,value为值,名和值在传送时都必须是URL编码的。

username = jackson

当流浪器从服务其上请求web页面时,属于该页面的cookie户添加到该请求中。服务器通过这种方式来获取用户信息。

二、localStorage

  1. 允许在浏览器中存储key/value对的数据。
  2. 用于长期保存整个网站的数据,保存的数据没有过期时间,直到手动去删除。
  3. 属性是只读的。

如果你想浏览器窗口关闭后还保留数据,可以使用localStorage;如果你只想将数据保存在当前会话中,可以使用sessionStorage.

三、sessionStorage

  1. 允许在浏览器中存储key/value对的数据。
  2. 数据对象临时保存同一窗口(或标签页)的数据,在关闭窗口或标签页之后也将删除这些数据。

四、indexedDB

索引数据库(indexDB)API(作为HTML5 的一部分)对创建具有吩咐本地存储数据的数据密集型的离线HTML5 Web 应用程序很有用。

同时它还有助于本地缓存数据,使传统再现Web应用程序(比如移动 Web 应用程序)能够更快的运行和响应。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

前端数据存储方式 的相关文章

  • 错误错误:未捕获(承诺):QuotaExceededError Ionic 3

    我正在使用 ionic 3 创建一个应用程序 我正在 ionic 存储中保存一个字符串 我工作得很好 但突然出现这个错误 Home ts 这是我设置字符串的地方 this storage set 123 JSON stringify dat
  • Next.js 中未定义 localstorage

    我正在尝试将应用程序从 React 移至 Next 在 React 中我没有收到此代码的错误 let authTokens setAuthTokens useState gt localStorage getItem authTokens
  • 当 localStorage 已满时会发生什么?

    我已经发现articles http code google com speed page speed docs caching html关于缓存行为 所以我只能假设它没有太大不同 但我想确定一下 我读到大多数浏览器都有 5MB 给予或接受
  • javascript 上的 localStorage 带来刷新

    我试图在空闲时关闭用户 在选项卡之间使用 javascript 下面的代码对于单个选项卡工作正常 对于多个选项卡它无法正常工作 例如 我设置了 10 秒作为空闲时间 并离开了第一个选项卡 它会在 10 秒内将用户抛出 假设我在以下位置打开了
  • localStorage()、window.localStorage() 或 document.localStorage() 哪个选项更好?

    这个问题说明了一切 我意识到所有的选择do在最新的浏览器中工作 但是语义上最好的选择是什么 为什么 根据W3C标准 正确的是window localStorage因为localStorage属性是 window 对象的一部分 它不是一个函数
  • 使用 Ionic 的本地存储

    我正在尝试将我的应用程序连接到本地存储 以便我可以将数据保存在用户设备上 并且不会在每次应用程序关闭时重置 我唯一的问题是我无法弄清楚如何将本地存储实际链接到我的对象数组 任何帮助是极大的赞赏 我添加了我认为相关的任何代码 app js I
  • HTML5 本地存储中的项目何时过期?

    数据保存多长时间localStorage 作为 HTML5 中 DOM 存储的一部分 可用吗 我可以为本地存储的数据设置过期时间吗 我建议将时间戳存储在object您存储在 localStorage 中 var object value v
  • 如何使用 HTML5 本地存储保存表单中的数据?

    我有一个表单可以登录到一个网站 但不能登录到我的网站 我希望它们通过 HTML5 本地存储保存在我的网站中的表单数据 但不知道如何 任何想法 我的表格是这样的
  • 如何在点击后隐藏横幅并使用本地存储保存?

    我是 Java 脚本新手 在用户单击 Cookie 横幅上的 接受 后 我不知道如何保存信息 本地存储 一旦他单击 接受 Cookie 横幅就会消失 我想保存因此 当他进入下一页或重新加载页面时 他不会再次收到 Cookie Banner
  • 使用 HTML5 localStorage 在 GWT 应用程序/小部件中缓存

    我正在尝试为我的 GWT 小部件之一合并数据缓存 我有一个数据源接口 类 它通过以下方式从我的后端检索一些数据RequestBuilder和 JSON 因为我多次显示小部件 所以我只想检索一次数据 所以我尝试提供应用程序缓存 天真的方法是使
  • PhoneGap iOS 7 和 localStorage

    我目前正在构建一个 PhoneGap 3 3 0 iOS 应用程序 该应用程序使用 Ember js EmberData 和 LocalStorage 适配器来保存数据 读了一些文章后就像这个 StackOverflow 问题 https
  • 在 Angular 8 应用程序中实现会话存储

    我正在构建一个电影应用程序来帮助我的学习 我想知道如何捕获按钮的点击次数并将其保存在会话存储中 我已经能够让点击工作了 它增加并显示每个按钮的点击次数 我用指令做到了这一点 我还尝试将按钮的 id 作为键和点击次数作为值附加到会话存储中 我
  • localStorage,使用toggleClass保存类

    我似乎对本地存储一无所知 我想通过切换类来设置一种最喜欢一组 div 中的任何 div 的方式 我可以让toggleClass在单个div上工作并保存 但localStorage将所有div保存为收藏夹 而不仅仅是设置了toggleClas
  • 使用 Android 浏览器的 HTML5 离线存储

    我正在研究如何使用 Android 设备来创建需要离线使用的网站 我还没有找到很多关于Android浏览器如何处理HTML5的localStorage和WebSQL的信息 有人知道这些的尺寸限制吗 它们是否可以更改 我知道移动 Safari
  • 当应用程序停止使用 Sencha Touch 2.2 和 Phonegap 时,LocalStorage 存储不会保留在 Android 手机上

    这在我的浏览器中工作正常 但是当我在手机上安装该应用程序并使用它时 它看起来很好 直到我强制它停止并重新打开该应用程序 然后我的所有记录都消失了 我正在使用 2 2 和 Phonegap 任何帮助将非常感激 这是我的商店 Ext defin
  • Cypress:我想通过登录一次在 100 个规范文件中运行测试,并为每个文件持续登录。是否可以?

    我有近 100 个规格文件 包括多个测试 我想通过登录一次来运行所有这些规格文件 我不希望我的 cypress 每次在每个规范文件上都登录进程 可以为所有规范文件保留单一登录 看看我们的 登录 食谱https github com cypr
  • 如何将React JS状态保存到本地存储中

    我不知道如何将 React js 状态存储到本地存储中 import React Component from react import App css import auth createUserProfileDocument from
  • Backbone.js 和本地存储。必须指定“url”属性或函数

    我正在提高有关 Backbone js 的知识 并从教程中获取了此代码示例 http bardevblog wordpress com 2012 01 16 understanding backbone js simple example
  • 使用本地存储在从另一个表保存的 HTML TABLE 中打印 JSON,以便我在另一个页面上打印我的表

    在我的作业中 我必须使用用户输入中的数据并将数据保存在本地存储中 我必须以水平表格式将这些数据从本地存储打印到其他页面 为此 我编写了用于用户输入并将数据保存在本地存储中的代码 div p p div
  • 尝试将数据存储在点击器网站中

    我正在尝试存储一个名为的变量score无论何时刷新 您都会一次又一次地使用它 我不明白的是它的代码是什么 我尝试了一些方法 但似乎都不起作用 这是我的答题器网站 但是当我尝试使用 JavaScript 来存储它时 它不起作用window o

随机推荐

  • 排列数【第十届】【决赛】【B组】

    在一个排列中 一个折点是指排列中的一个元素 它同时小于两边的元素 或者同时大于两边的元素 对于一个 1 n 的排列 如果可以将这个排列中包含 t个折点 则它称为一个 t 1 单调序列 例如 排列 1 4 2 3 是一个 3 单调序列 其中
  • GTK+的优点与QT的优点

    想看看图形界面系统的优缺点 转载了网友整理的 GTK 的优点与QT的优点整理 在嵌入式 Linux 下有很多图形界面系统 GUI 包括 Qt Embedded FLTK Microwindows 和 GTK 等 作为一个开发者 到底使用什么
  • YOLOv8+ByteTrack多目标跟踪(行人车辆计数与越界识别)

    课程链接 https edu csdn net course detail 38901 ByteTrack是发表于2022年的ECCV国际会议的先进的多目标跟踪算法 YOLOv8代码中已集成了ByteTrack 本课程使用YOLOv8和By
  • arcgis已试图对空几何执行该操作_ArcGIS中坐标转换和投影变换

    当不同来源 不同坐标系统的空间数据要在一起使用 相互参照时 就要进行坐标转换 如果涉及不同的地图投影 就要进行投影变换 动态投影 所谓动态投影 是指改变ArcMap中的数据框架 DataFrame 的空间参考或者对后加入ArcMap中的数据
  • liunx常用命令

    在liunx中可能有几百个命令 最常用的就10多个 liunx中最常用的命令 ls 功能 使用说明 案例 pwd 功能 使用说明 案例 cd 功能 使用说明 案例 mkdir 功能 使用说明 案例 touch 功能 使用说明 案例 rm 功
  • 动力节点 SpringBoot教程 p15 Whitelabel Error Page

    一步一步跟着王妈妈敲的 还是报错 后来发现是目录的问题 initiizer初始化出来application和comtroller不在一个包下面 把他挪到controller包下面就ok了 或者把他挪到和controller目录一个层次也可以
  • Android--沉浸式导航栏适配

    转自 Android 沉浸式导航栏适配 Aruba233的博客 CSDN博客 本文是用于设配SDK4 4到5 0的沉浸式导航栏适配 4 4下面的实现不了沉浸式 上次说到适配沉浸式状态栏时 为DecorView添加一个View可以是实现 导航
  • 包装类的使用

    包装类的使用 1 相关概念 java提供了8种基本数据类型对应的包装类 使得基本数据类型的变量具有类的特征 需要掌握 基本数据类型 包装类 String三者之间的相互转换 2 基本数据类型和包装类的互转 基本数据类型转换包装类 调用包装类的
  • EMI 滤 波 器 原 理 与 设 计 方 法 详 解

    输入端差模电感的选择 差模 choke 置于 L 线或 N 线上 同时与 XCAP 共同作用 F 1 2 L C 波器振荡频率要低于电源供给器的工作频率 一般要低于 10kHz L N2AL nH N2 nH N L nH AL nH N2
  • qt 动画(界面跳转进场动画)

    目标 做上位机软软件的时候 觉得QTabWidget的每个tab跳转时候 单纯的界面显示太过单调 希望有界面上面的控件有一个进场的动画效果 效果 实现 通过动画QPropertyAnimation把设置单个控件动画效果 在用组合动画类QSe
  • [编程入门]二维数组的转置

    题目描述 写一个函数 使给定的一个二维数组 转置 即行列互换 输入 一个3x3的矩阵 输出 无 样例输入复制 1 2 3 4 5 6 7 8 9 样例输出复制 1 4 7 2 5 8 3 6 9 思路 二维数组转置 即为i变为j j变为i
  • rabbitmq 常用配置

    rabbitmq 常用配置 rabbitmq 指定RabbitMQ host 默认为 localhost spring rabbitmq host rabbitmq piecloud infra xx 端口号 默认端口号5672 sprin
  • 云计算与Kubernetes(k8s)

    参考链接 https blog csdn net zkkzpp258 article details 86541362 https blog csdn net Bubbler 726 article details 85596418 htt
  • SpringBoot+Mybatis-plus实现多数据源动态切换的两种方式

    一 自定义注解方式 本文中使用的数据源为HikariCP 实现数据源之间的切换用 DataSource自定义注解 配置AOP进行切换 需要引用的包此处不再说明 yml中mysql相关配置如下 datasource 动态数据源配置 dynam
  • 使用计算机录制声音10,Win10怎么录制电脑内部声音 Windows10电脑自身录音教程

    有很多Win10系统用户常常会碰到需要录制电脑内部声音的情况 但是一般这种问题 需要进行设置 相信小伙伴们应该都不是非常了解 那么今天小编就通过这篇文章给大家介绍一下应该如何快速有效的进行内部录音 我们一起往下看教程讲解吧 1 第一步 在W
  • 【python】使用pyqtgraph+pyserial提高绘图效率的方法

    基于pyqtgraph的高速采样和绘图 背景 解决方案 背景 使用场景为从串口读取传感器数据 并实时绘图 如下图所示 采样率为600Hz 采用子进程的方式分别进行读取数据和绘图 进程之间使用python自带的队列queue Queue进行数
  • C++ 类中protected的通俗解释

    举个例子 假如我们要定义人这个类 其中每个人都有三种财富 养老金 子女金 生活金 首先是生活金 每个人的生活金其实都是可以对外公开的 所以应该可以设置为public 但是遗产和养老金是不对外公布的 那么问题来了 遗产和养老金是不是都应该设置
  • 医院安全不良事件报告系统源码 PHP+ vue2+element+ laravel8+ mysql5.7+ vscode开发

    不良事件上报系统通过 事前的人员知识培训管理和制度落地促进 事中的事件上报和跟进处理 以及 事后的原因分析和工作持续优化 结合预存上百套已正在使用的模板 帮助医院从对护理事件 药品事件 医疗器械事件 医院感染事件 输血事件 意外事件 职业暴
  • js最简单的动画

    document ready function reset click function removeAttr style div class none css display none input type button click fu
  • 前端数据存储方式

    一 Cookie cookie 用于存储web页面的用户信息 cookie 是一些数据 存储在你电脑上的文本文件中 当web服务器向浏览器发送web页面时 在连接关闭后 服务端不会记录用户的信息 Cookie的作用就是用于解决如何记录客户端