移动web开发ajax缓存操作
移动web开发过程中网速是必须考虑的一个因素,所以一般是尽可能的在本地存储数据,避免弱网环境下请求数据失败导致页面没有内容的情况。
前后端分离是web开发的必然趋势,在PC端我们有时甚至为了避免ajax缓存去做一些处理,但是移动端我们却需要把ajax请求给缓存下来,尤其是json数据。
function ajaxCache(opt){
function getStoreKey(opt){
var url = opt.url;
//缓存最后面的json文件名
var storeKey = url.match(/([^\/]*)\/*$/)[1];
var hashStr = url;
if (opt.data){
hashStr += JSON.stringify(opt.data);
}
var hash = hashStr;
storeKey += hash;
return storeKey;
}
//加载缓存的数据
function loadCachedData(opt, storage){
var storeKey = getStoreKey(opt);
var data = storage.getItem(storeKey); try{
data = JSON.parse(data);
} catch(e){
Logger.log(storeKey+":缓存数据解析出错");
data = null;
} return data;
} function attachSuccessProxy(opt, storage){
var oldSuccess = opt.success;
opt.success = function(){
var data = arguments[0];
if (data){
var storeKey = getStoreKey(opt);
storage.setItem(storeKey, JSON.stringify(data));
} oldSuccess.apply(this, arguments);
};
} var cachedAjax = function(opt){
if (!opt.url){
opt.url = location.toString();
} if (opt.sessionCache && opt.success){
var sessionData = loadCachedData(opt, session);
if (sessionData){
opt.success(sessionData, 'session');
return; // no further request from remote server
} attachSuccessProxy(opt, session);
} if (opt.localCache && opt.success){
var localData = loadCachedData(opt, local);
if (localData){
opt.success(localData, 'local');
} attachSuccessProxy(opt, local);
} $.ajax(opt);
}; return cachedAjax;
}
移动web开发ajax缓存操作的更多相关文章
- web开发之缓存
以数据为驱动的web站点,当访问量增大后,由于频繁的从DB中读取数据,使得DB服务器的压力大增,从而影响系统的性能.为了缓解这种来自于大访问量的频繁读取DB的压力,我们可以把一些数据缓存起来,当请求过 ...
- Web 开发后端缓存思路
数据写入缓存: 在数据库与服务端之间利用 redis 这是一个很常见的场景.比如文章的浏览数,每次文章被浏览时,浏览数都 +1.如果每次都回写数据库,不免数据量太大.加上数据库看似简单,其实做了不少关 ...
- spring boot web 开发及数据库操作
推荐网站http://springboot.fun/ 1.json 接口开发 2.自定义 filter 3.自定义 property 4.log 配置 5.数据库操作 6.测试
- asp.net web 开发登录相关操作的控件LoginName、LoginStatus和LoginView控件使用详解
http://book.51cto.com/art/200909/154039.htm http://book.51cto.com/art/200909/154041.htm ASP.NET提供了一套 ...
- web开发:javascript操作
一.函数闭包 二.面向对象 三.js选择器 四.事件初始 五.js处理页面内容 六.js事件控制标题栏 七.js控制类名 一.函数闭包 ```js// 函数的嵌套定义, 定义在内部的函数就称之为 闭包 ...
- Python学习-前台开发-ajax操作
概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操作需要 ...
- Web开发基本准则-55实录-缓存策略
续上篇<Web开发基本准则-55实录-Web访问安全>. Web开发基本准则-55实录-缓存策略 郑昀 创建于2013年2月 郑昀 最后更新于2013年10月26日 提纲: Web访问安全 ...
- Web的Ajax应用开发模式(二)——Ajax开发模式分析
寄语: 前天在查看一些公司的招聘要求时,看到有公司要求测试人员了解Ajax,故写此博文旨在帮助测试人员提高自身技术知识水平,愿与广大测试同胞共同进步.(欢迎纠错!!!) Web应用的传统开发模式总结: ...
- Ajax与传统Web开发的区别
基本概念 1.1,Ajax AJAX:即“Asynchronous Javascript And XML”(异步的JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,尤其是在一种 ...
随机推荐
- 2016级算法第三次上机-F.ModricWang的导弹防御系统
936 ModricWang的导弹防御系统 思路 题意即为:给出一个长度为n的序列,求出其最长不降子序列. 考虑比较平凡的DP做法: 令\(nums[i]\) 表示这个序列,\(f[x]\) 表示以第 ...
- tp5 重定向缺少index.php报错(No input file specified)
转别人的,有用,Mark一下 public 下的.htaccess 修改为 <IfModule mod_rewrite.c> Options +FollowSymlinks -Multi ...
- dw cs6设置字体样式
1 编辑->首选参数->字体 改代码试图的字体和大小.点确定即可.
- 「Nosql」Redis小记-内存解析&内存消耗篇
*博客搬家:初版发布于 2017/08/12 18:32 原博客地址:https://my.oschina.net/sunqinwen/blog/1507171 Redis内存消耗分析 注:本文 ...
- L2-3 名人堂与代金券 (25 分)
#include<cstdio> #include<algorithm> #include<cstring> using namespace std; int N, ...
- 7. JavaScript学习笔记——DOM
7. DOM 7.1 DOM简介 DOM是文档对象模型,HTML文档的所有内容都是节点: 整个文档是一个文档节点 (document 最顶级) HTML元素内的文本是文本节点 每个表面的属性是属性节点 ...
- Codeforces - tag::dp 大合集 [占坑 6 / inf]
Gym - 100753J 某国家仅有金币和银币两种货币,起汇率为g,纪念品市场有n个商人和商品,商人结帐只用银币,并且把一堆银币装在袋子里,分为三种类型,分别按向下/向上/四舍五入取整(其中向上的优 ...
- rest-framework框架组件
序列化组件 创建一个序列化类, 视图四种方式 以下代码都需要创建一个serializers.py文件 from rest_framework import serializers from CBV_a ...
- 一个迷你的 Node.js 基于 Express 的 MVR 模式的 API工程 的分析
1. 工程说明 该工程是基于 Express 库,编写的一个 API 查询返回的一个微型应用. API Resource 就是把 API 的内容当做网络资源去处理.工程中的路由访问也是返回 API 内 ...
- @media响应式布局
@media可以根据屏幕尺寸调节布局 @media screen and (min-width:100px) and (max-width:200px){ div { color:red; } } 在 ...