h5-localStorage实现缓存ajax请求数据

使用背景:要实现每次鼠标hover“能力雷达”,则显示能力雷达图(通过ajax请求数据实现雷达图数据显示),所以每次hover都去请求ajax会影响性能,因此这里要用到本地缓存。
实现:
此处是通过传id去请求能力雷达图数据,因此要setItem()的不止1个,所以当ajax返回result后,根据id去创建名称
$.ajax({
type: "POST",
cache: false,
url: "/Question/GetShopRadarMap",
data: {
shopId: id
},
contentType: "application/x-www-form-urlencoded",
dataType: "json",
async: false,
success: function (result) {
localStorage.setItem("radarResult_" + id + "", JSON.stringify(result.resultList)); //存储的时候 使用JSON.stringify()将对象解析出字符串
var resultList = result.resultList;
// 执行能力雷达图的数据绑定及展示
} });
当鼠标再次hover能力雷达图的时候:根据id获取已经存储了的数据,就不用每次都去发送请求
var storage = localStorage.getItem("radarResult_" + id + "");
if (storage != null) {
var resultList = JSON.parse(storage); // 从一个字符串中解析出json对象
// 执行能力雷达图的数据绑定及展示
}
h5-localStorage实现缓存ajax请求数据的更多相关文章
- 关于ajax请求数据,并将数据赋值给全局变量的一些解决方法
在使用ajax请求数据是,开始的时候是打算将ajax的数据取出,并赋予给全局变量,但是在实际编码过程中发现并不能将数据赋予给最开始定义的全局变量,出现这个问题的原因是由于ajax异步加载的原因,所以只 ...
- vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询
vue使用element Transfer 穿梭框实现ajax请求数据和自定义查询 基于element Transfer http://element-cn.eleme.io/#/zh-CN/comp ...
- Ajax请求数据的两种方式
ajax 请求数据的两种方法,有需要的朋友可以参考下. 实现ajax 异步访问网络的方法有两个.第一个是原始的方法,第二个是利用jquery包的 原始的方法不用引入jquery包,只需在html中编写 ...
- session失效,使用ajax请求数据被拦截,此时正常的处理逻辑是跳到登录界面,而不是界面没有变化(java推断是否是ajax请求)
在登录过滤器中.推断请求是ajax请求还是超链接或者地址栏变化的请求 if (httpServletReq.getHeader("x-requested-with") != nul ...
- 使用Python的Flask框架,结合Highchart,动态渲染图表(Ajax 请求数据接口)
参考链接:https://www.highcharts.com.cn/docs/ajax 参考链接中的示例代码是使用php写的,这里改用python写. 需要注意的地方: 1.接口返回的数据格式,这个 ...
- 解决IE浏览器缓存导致AJAX请求数据异常
IE10浏览器会把AJAX请求的数据都缓存下来,然后每次想去刷新数据时发现数据都是一样的,于是导致数据显示异常. 解决方法: 在页面<head>标签里,加上以下声明: <!-- 解决 ...
- 唯独ie浏览器缓存ajax请求
用fiddler调试http请求,在ie浏览器下,如果请求命中缓存,fiddler不会包含该请求.但是在chrome下会包含缓存的请求,Result显示为304. ie浏览器还会缓存通过ajax请求的 ...
- 使用ajax请求数据时的几种做法
在进行前后端交互的时候,一般前端使用ajax向后端发送数据,后端根据发送的数据来返回数据,前端将这些数据接收并进行相应的处理 以下是在日常工作中总结的几点使用ajax传递数据时的情况: 1.在本页面( ...
- 前端缓存API请求数据
1. 背景 在一些项目中,有时候会出现不同模块重复请求大量相同api接口的情况,特别是在一些功能相似的后台管理页面中.以下面这几个页面为例,每次进入页面都需要请求等大量重复的下拉框数据,下拉框数据短时 ...
随机推荐
- LoadRunner监控tomcat
LoadRunner监控tomcat (2012-10-25 14:01:42)转载▼ double atof (const char * string);Action(){ // 保存JVM内 ...
- Python实时语音识别控制
代码地址如下:http://www.demodashi.com/demo/12946.html Python实时语音识别控制 概述 本文中的语音识别功能采用 百度语音识别库 ,首先利用 PyAudio ...
- SpringBoot学习小结
基于Spring,简化Spring应用开发的框架,整个Spring技术栈的大整合,J2EE开发的一站式解决方案 优点: 快速创建独立运行的Spring项目以及集成主流框架 使用嵌入式的Servlet容 ...
- 安装Drupal7.12+Postgresql9.1(Ubuntu Server 12.04)
怀揣着为中小企业量身定做一整套开源软件解决方案的梦想开始了一个网站的搭建.http://osssme.org/ OS环境准备 这次是从OS开始安装的.最开始装Ubuntu12.04这里就不再赘述, 唯 ...
- Cocos2dx报OpenGL error 0x0506错误
近期做第三方sdk接入时,发现iOS8系统下,进行银联充值后,返回游戏有很大几率会报 OpenGL error 0x0506............ 之类的绘制问题,游戏卡死,花了很长时间,一直没有头 ...
- Fiddler4插件开发实践
Fiddler4 是一款 巴拉巴拉..... 连接在这:http://www.telerik.com/fiddler 开发文档在这:http://docs.telerik.com/fiddler/Ex ...
- C++之栈、队列基本用法
1.C++栈的基本用法: #include<stack> (1)push():向栈内压入一个成员: (2)pop():栈顶弹出一个成员: (3)empty():栈为空返回true,否则返回 ...
- dubbo_分布式框架dubbox介绍
1.Dubbo概述Dubbo是阿里巴巴开源出来的一个分布式服务框架,致力于提供高性能和透明化的RPC远程服务调用方案,以及作为SOA服务治理的方案.简单的说,dubbo就是个服务框架,如果没有分布式的 ...
- shell实现洗牌随机
洗牌问题: 洗一副扑克,有什么好办法?既能洗得均匀,又能洗得快?即相对于一个文件来说怎样 高效率的实现乱序排列? 关于洗牌问题,其实已经有了一个很好的shell解法,这里另外给三个基于AWK的方法, ...
- java - day07 - PrimeNum
判断质数 package day06; import java.util.Scanner; //验证质数 public class primeNum { public static void main ...