前端数据存储方式

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(使用前将#替换为@)

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

  • 如何加载本地json文件?

    有没有办法使用 about config 配置 Firefox 以允许本地文件访问 用于演示目的 特别是使用 FF12 我需要能够对 json 数据进行本地文件访问 它在服务器上运行良好 但我想让这个演示更加便携 ajax url asse
  • 从本地文件访问 localStorage

    我正在创建 2HTML文件将存储在本地 iPhone 上并通过WebView 我想知道是否可以设置localStorage在一个文件中 并从另一个文件中获取存储结果 我知道localStorage可以从同一域上的文件访问 但是 您似乎无法从
  • Android WebView如何处理数据?

    Android的WebView可以使用本地存储 Service Workers IndexedDB和许多其他功能 但是 我无法找到有关此数据存储位置以及何时清除的任何信息 通过一些测试 我已经能够确定它们没有存储在缓存中 因为我可以删除缓存
  • localStorage 内容带有时间戳以自行删除

    我想要一个本地存储内容的计时器 例如我有一个动态更新的 DIV div p test p div 并设法使用以下代码将其作为 html 块添加到 localStorage function localStorage homeNews JSO
  • 使用 useState 和 useContext React Hooks 持久化 localStorage

    我已经设置了一个提供程序来为用户共享一些状态useContext 因此 我试图利用本地存储来保存用户图像 头像等 的一些状态 首先 我尝试保留用户的头像 本质上是从 Express 中保存他们的 ID 然后在调用 Cloudinary 一种
  • HTML5 WebStorage 数据是如何物理存储的?

    在使用 HTML5 WebStorage 功能时 我知道某些浏览器 例如 Chrome 具有开发人员工具 使用户能够浏览其 WebStorage 的内容以进行调试和故障排除 我想知道是否可以查看文件系统中网络存储的内容 此内容是否存储在文件
  • 使用 Ionic 的本地存储

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

    我是 Java 脚本新手 在用户单击 Cookie 横幅上的 接受 后 我不知道如何保存信息 本地存储 一旦他单击 接受 Cookie 横幅就会消失 我想保存因此 当他进入下一页或重新加载页面时 他不会再次收到 Cookie Banner
  • Chrome devtool本地存储信息未及时更新

    Chrome版本 103 0 5060 134 arm64 Before LocalStorage和SessionStorage跟随页面js运行实时更新 Now 需要手动切换devtools选项卡或者点击devtools左上角刷新按钮来查看
  • IE10 中本地存储的访问被拒绝

    昨天我安装了 Windows 8 现在试图了解为什么我在访问本地存储时收到 访问被拒绝 消息 该页面与浏览器 http localhost 位于同一台 PC 上 我的感觉是IE 10中的一项安全设置是错误的 但我还没弄清楚是哪一项 触发错误
  • 如何在 Vue js 中使 localStorage 中的数据响应

    我在 Vue js 项目中使用 localStorage 作为数据源 我可以读写 但找不到反应性使用它的方法 我需要刷新才能看到我所做的任何更改 我使用数据作为多个组件的道具 当我写入时localStorage从我触发的组件forceUpd
  • Javascript 在选中的复选框上克隆此 div,在未选中的情况下删除此 div

    选中该复选框后 克隆正确的 div 并将其显示在示例中 div div 当取消选中该复选框时 删除克隆 并伴随localStorage 有人可以帮我解决这个问题吗 function onClickAvGamesCheckBox var ar
  • 如何在不破坏localStorage中类型的情况下存储和获取对象?

    我正在使用 TypeScript 开发 AngularJS 项目 A person是一个对象Person班级 我需要存储person对象在localStorage并用它的类型检索它 窗口本地存储 https developer mozill
  • Stackoverflow 使用本地存储进行授权似乎不安全。这是正确的,否则我们如何加强它?

    我一直在研究类似于 stackexchange 的身份验证和授权模块 现在我确信他们使用某种模型的 oAuth 或令牌生成服务器来授权使用他们的各个站点 我尝试了一个小实验 登录 Stackoverflow 后 我会从开发者控制台删除所有
  • 如何在 Angular 应用程序中存储身份验证令牌

    我有一个与 REST API 服务器通信的 Angular 应用程序 SPA 我有兴趣找到存储从 API 服务器返回的访问令牌的最佳方法 以便 Angular 客户端可以使用它来验证未来的请求到 API 出于安全原因 我想将其存储为浏览器会
  • 如何在引导模式上设置本地存储?

    modal 2 id 打开调查模式 我想要的只是这个特定的模式 在有人单击关闭按钮后每 24 小时重新出现一次 document ready function var modals events if window location has
  • 在 Angular 8 应用程序中实现会话存储

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

    我已成功允许用户将图像上传到本地存储 但我希望能够获取该图像并用它填充页面上的图像元素 h3 Please upload the image you wish to use h3
  • 是否可以在 Windows 应用商店应用程序中的用户之间共享数据?

    我很确定我知道这个问题的答案 非常大的否 但是是否可以在相同的应用程序但是 Windows 运行时环境中有多个用户 Windows 登录 而不是 Microsoft Store 用户 本地数据文件夹是相对于每个登录用户而言的 所以乍一看这似
  • 将 css 背景设置为本地存储中的图像

    我希望将 base64 格式的图像存储在密钥中的本地存储中ImgStorage在CSS背景中像这样 data image png base64 iVBORw0KGgoAAAANS 到目前为止 我尝试了两种方法 1 从存储加载并放入css标签

随机推荐

  • 排列数【第十届】【决赛】【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的作用就是用于解决如何记录客户端