Ajax内容签名技术(减少无谓流量损耗)
UI界面Ajax获取数据内容的时候,一般是直接加载内容填充,不管内容有无变化。自己也是一直这么干,包括定时刷新公告等。
今天在浏览器控制台调试的时候,发现动态刷新内容,其实挺耗费流量的,特别是内容无变化的时候,却一直要传输同样的内容,而部分刷新,加载的是大量的内容。这样就造成了流量的无谓浪费,而且刷新的时候,dom容器也会闪烁一下,用户体验很不好。
所以今天突然想到一个方法,就是把传输内容格式改造一下,返回json格式,格式为:{"value":"","sign":""},value对应的是原来的内容,sign是内容的MD5签名。
ajax获取数据后,把内容的sign值和dom元素的[data-sign]比对:
1.如果是第一次获取,则此时dom元素的[data-sign]为空,所以应该把内容的sign值写入到dom元素的[data-sign]中,并且应用value值。
2.如果不是第一次获取,则把dom元素的[data-sign]作为请求参数,发送给服务端后台,服务端后台根据传入的sign参数的值与内容生成的md5值比对,如果内容签名值与参数sign值不一致,则说明内容有变化,输出内容为:{"value":"内容","sign": $md5_sign},前端则重复第一步操作。如果内容签名值与参数sign值一样,则说明内容没有变化,这时就没必要返回内容值了,输出内容为:{"value":"","sign":$md5_sign},从而节省了无谓的流量消耗。
这个方法,命名为:Su-AjaxContent-Sign (SACS) Ajax内容签名。
Ajax内容签名技术(减少无谓流量损耗)的更多相关文章
- 使用Ajax内容签名,减少流量浪费
前端UI界面用Ajax获取数据内容的时候,一般是直接获取内容数据并填充,不管内容有无变化,不管数据量多大,都是直接重新加载数据,例如定时刷新公告等. 今天在浏览器控制台调试的时候,发现动态刷新内容,其 ...
- Ajax原理,技术封装与完整示例代码
在做项目和学习的时候,经常用到Ajax的相关技术,但是这方面的技术总是运用的不是十分好,就寻找相关博客来学习加深Ajax技术相关. 一.Ajax简介 二.同步.异步传输区别 2.1 异步传输 2.2 ...
- 如何让搜索引擎抓取AJAX内容? 转
越来越多的网站,开始采用"单页面结构"(Single-page application). 整个网站只有一张网页,采用 Ajax 技术,根据用户的输入,加载不同的内容. 这种做法的 ...
- 如何让搜索引擎抓取AJAX内容?
越来越多的网站,开始采用"单页面结构"(Single-page application). 整个网站只有一张网页,采用Ajax技术,根据用户的输入,加载不同的内容. 这种做法的好处 ...
- 基于http的追加协议、构建web内容的技术、web的攻击技术(9,10,11)
第九章 基于http的追加协议 用来提升http的瓶颈,比如Ajax技术,spdy等 第十章 构建web内容的技术 html.css.js等 第十一章 web的攻击技术 比如sql注入攻击.xss等.
- 爬虫实战【6】Ajax内容解析-今日头条图集
Ajax技术 AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). Ajax并不是新的编程语言,而是一种使用现有标准的新方法,当然 ...
- 2018-06-25 js表单事件、三个高度和Ajax异步通讯技术
表单事件: onfocus -> 表单控件得到焦点时触发: obj_ipt.onfocus=function(){}; onblur -> 表单控件失去焦点时: onchange -> ...
- Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化
Atitit 发帖机实现(3 )---usrQBN023 js提交ajax内容到后端规范与标准化 大段内容务必要替换转义换行符号1 提交务必使用utf编码,否则解码后的可能缺失,是web serv ...
- 【学习笔记】AJAX内容拓展
题记——近期回顾<javaScript高级程序设计>ajax章节,发现书中对封装一个ajax库并不完美,结合之前看到博客,对ajax库做一点点的优化. 参考博客:如何去封装一个ajax库 ...
随机推荐
- vue部署到nginx服务下,非根目录,刷新页面404怎么解决?
nginx配置 location / { proxy_pass http://xxxx; } location /category { root /home/tv; index index.html; ...
- C#学习笔记_06_方法&函数
06_方法&函数 方法的定义 方法就是一个功能的集合,可以把程序中某段具有特殊功能的代码提取出来: 声明方法 [ 访问权限修饰符 ] [ 其他的修饰符 ] 返回值类型 方法名 ( [形参列表] ...
- Java设计模式之 — 模板方法(Template Method)
转载请注明出处:http://blog.csdn.net/guolin_blog/article/details/8744002 今天你还是像往常一样来上班,一如既往地开始了你的编程工作. 项目经理告 ...
- svn_精简版【极速安装】
1.进入官网下载:http://tortoisesvn.net/ 2.进行安装. 3.官方下载汉化包 [32 位,64位] 4.安装完汉化包后,右键->Settings 5.选择语言包,确定就o ...
- opencv学习HighGUI图形用户界面初步【1】
HighGUI是图形用户界面模块.包括:1.输入与输出:2.视频捕捉:3.图形和视频的解码编码:4.图形交界面与接口. 由于opencv.hpp包含了core.objdetect.ingproc.ph ...
- HDU 4456 Crowd
Crowd Time Limit: 5000/2000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submi ...
- mac Gitblit安装
jdk下载传送门 gitBlit是java编写的的 第一步 需要安装java jdk 传送门 JDK6的下载地址: http://www.oracle.com/technetwork/java/jav ...
- Automatic Tuning of Memory Management
4.2.2 Automatic Tuning of Memory Management Two memory management initialization parameters, MEMORY_ ...
- POJ 1066
由于到达点时不能绕墙,因为这是无意义的,所以,两点间的最小墙依然是按照直线所穿过的墙计算. #include <iostream> #include <cstdio> #inc ...
- 使用java -jar运行jar包
使用java -jar运行jar包 摘要 其实不难,网上搜了不少,但是讲不全,或者讲得不少,有的细节却漏掉了, 在此,我想将详细点 java -jar 1.其实命令比较简单:进入相应的目录后,执行ja ...