美文网首页
前端缓存接口数据的实现

前端缓存接口数据的实现

作者: 隔壁老王z | 来源:发表于2022-07-12 22:27 被阅读0次

前端缓存 API 接口数据,前端怎么知道数据是否变了,该不该取缓存的数据呢。
可以采用 HTTP 协商缓存 ETag 来实现:
在后台每次修改需要缓存的数据时都进行一次 hash(当然也可以使用其他算法生成唯一标识)

将接口地址与 hash 值存为键值对

逻辑大概为:

数据没有发生变化,则接口响应304,ETag header不变,前端仍然用老数据

数据发生了变化,则接口返回新的ETag header和新的数据,前端对比新老ETag不一致,则更新数据

相关文章

  • 前端缓存接口数据的实现

    前端缓存 API 接口数据,前端怎么知道数据是否变了,该不该取缓存的数据呢。可以采用 HTTP 协商缓存 ETag...

  • 前端缓存

    前端缓存 提示这里讲的前端缓存是指前端对接口数据的缓存处理,而不是通过 HTTP(s)缓存 前言 通常会在项目中有...

  • axios cache前端数据缓存

    提示这里讲的前端缓存是指前端对接口数据的缓存处理,而不是通过 HTTP(s)缓存 GITHUB[https://s...

  • fsLayui缓存使用

    概述 缓存主要使用在编辑或查看页面查询数据的方式,通过后端servlet接口获取数据还是通过前端缓存获取。缓存可以...

  • 资料收集

    1,ie上的接口请求 304是前端缓存还是后端数据缓存2,vue monted 和 updated 内...

  • MVVM 架构演进(一) —— 初探

    一. 什么是 MVVM ? MVVM 是前端一款数据驱动的架构 Model: 网络接口数据, 本地缓存数据等 Vi...

  • 原生js开发AJAX数据分页缓存模块

    效果知识点:原生Js实现ajax数据交互、数据分页技术原理剖析,前端数据缓存, H5domAPI应用, 职业化前端...

  • Mock

    一、 Mock数据:实现前端分离开发,在后端没有准备好数据接口的情况,前端也可自行模拟数据 二、 mock数据...

  • Mock

    一、 Mock数据:实现前端分离开发,在后端没有准备好数据接口的情况,前端也可自行模拟数据 二、 mock数据...

  • js下载文件+js监听文件下载完成功能

    注意: 下载文件,清楚缓存策略(最好后端接口处理,前端处理有些浏览器不识别)后端: 接口再头部添加清除缓存标记前端...

网友评论

      本文标题:前端缓存接口数据的实现

      本文链接:https://www.haomeiwen.com/subject/zpzabrtx.html