Web实时更新客户端数据
1 轮询方式实现客户端数据及时更新
在基于Web的即时通信、股票行情这样的系统中,需要客户端能够及时更新内容。由于B/S架构的特性(Http连接是无状态连接, 即服务器处理完客户的请求,并收到客户的应答后即断开连接),最简单的方式是通过客户端轮询的方式实现客户端刷新。
较早是将一个隐藏的iframe嵌在网页中,通过该iframe不断刷新来获取最新内容,现在通过Ajax来实现,通过每隔一段时间发起Http请求实现数据更新,并可以实现异步更新。轮询方式显而易见的缺点就是会造成服务器较大负载。
Note:传统的JavaApplet和ActiveX通过Socket通信可以实现数据的及时更新。
2 Comet 服务器推送数据到客户端
现在还有一种技术是Comet,Comet其实就是许多年前流行的CGI聊天室所用的Server Push技术。这个方法一开始是由Client对Server建立连接,但是Server在建立连接后,送出的header中要把content-type设为“multipart/x-mixed-replace”,就是server之后要分或多次返回多片段数据,让Client保持连接,并且把每次拿到的数据取代之前的数据片段。接着client就只要在保持不断的连接上等着server发送的数据就好了。Comet利用这种特性,加上Ajax能异步更新数据,变成开发rich client非常重要的技术。
但Comet不像Ajax那样容易用到现成的http server上,它需要server上有适当的程式配合。[2]参考文献[1] 提供了使用Comet的代码片段。
3 HTML 5的数据更新
HTML5本身提供了对即时数据更新的支持。
Html5中的Server-Sent 事件用来实现网页自动获取来自服务器的更新,Server-Sent是单方面的消息传递。通过服务器发送事件,更新能够自动到达,从而实现微博更新、赛事结果这样的应用。
HTML5的Web Socket 使浏览器和服务器之间可以建立一个基于 TCP 连接的双向通道。Web 开发人员可以非常方便地使用 WebSocket 构建实时 web 应用。
4 参考
[1] Comet 服务器“推”技术,实现web服务器“主动”向客户端发送数据。
http://www.360doc.com/content/11/0617/16/597197_127627804.shtml
[2] Comet(Server Push) on Turbogears(2)
blog.vgod.tw/tag/server-push
[3] HTML5服务器发送事件.
http://www.w3school.com.cn/html5/html_5_serversentevents.asp
[4] 使用 HTML5 WebSocket 构建实时 Web 应用.
http://www.ibm.com/developerworks/cn/web/1112_huangxa_websocket/
Web实时更新客户端数据的更多相关文章
- android ListView中含有按钮事件实时更新ListView数据案例
1.布局文件Listview <?xml version="1.0" encoding="utf-8"?> <android.support. ...
- WebSocket 实时更新mysql数据到页面
使用websocket的初衷是,要实时更新mysql中的报警信息到web页面显示 没怎么碰过web,代码写的是真烂,不过也算是功能实现了,放在这里也是鞭策自己,web也要多下些功夫 准备 引入依赖 & ...
- Python tkinter库将matplotlib图表显示在GUI窗口上,并实时更新刷新数据
代码 1 ''' 2 使用matplotlib创建图表,并显示在tk窗口 3 ''' 4 import matplotlib.pyplot as plt 5 from matplotlib.pylab ...
- solr实时更新mysql数据的方法
第一步:创建core core是solr的特有概念,每个core是一个查询数据,.索引等的集合体,你可以把它想象成一个独立数据库,我们创建一个新core:名字[core1] 进入linux命令行,进入 ...
- Android RecyclerView嵌套EditView实时更新Item数据
一.场景(例如:购物车) 1.当我们需要以列表样式管理某些数据时,可能需要列表项的某个字段可编辑 2.编辑Item上的某个字段后可能还要更新相关字段的值 二.可能遇到的问题 1.列表滑动导致输入框中的 ...
- WinForm DataGridView实时更新表格数据
前言 一个特殊的项目没有用第三方控件库,但用到了DataGridView,由于是客户端产生的数据,所以原始数据源就是一个集合. 根据需要会向集合中添加数据项,或是修改某些数据项的值,但DataGrid ...
- Jquery无刷新实时更新表格数据
html代码: <style> .editbox { display:none } .editbox { font-size:14px; width:70px; background-co ...
- Web网站数据”实时”更新设计
请注意这个实时打上了双引号,没有绝对的实时,只是时间的颗粒不一样罢了(1ms,1s,1m). 服务器数据有更新可以快速通知客户端.Web 基于取得模式,而服务器建立大量的和客户端连接来提供数据实时更新 ...
- 使用php+swoole对client数据实时更新(下)
上一篇提到了swoole的基本使用,现在通过几行基本的语句来实现比较复杂的逻辑操作: 先说一下业务场景.我们目前的大多数应用都是以服务端+接口+客户端的方式去协调工作的,这样的好处在于不论是处在何种终 ...
随机推荐
- TypeScript 在开发应用中的实践总结
背景 以前 hybrid app 的移动端开发模式下,H5 和客户端通信的 js sdk 代码使用 js 编写,sdk 方法的说明使用文档输出.对于开发的使用来说,在 IDE 中不能得到友好的参数类型 ...
- Linux 的ftp服务未启用怎么办
1.检查是否安装ftp相关的rpm包(如出现下面提示证明是安装过相关rpm包的) [root@rac1 ~]# which vsftpd /usr/sbin/vsftpd [root@ra ...
- vue 快速入门 系列 —— vue loader 上
其他章节请看: vue 快速入门 系列 vue loader 上 通过前面"webpack 系列"的学习,我们知道如何用 webpack 实现一个不成熟的脚手架,比如提供开发环境和 ...
- hdu 2842 Chinese Rings 矩阵快速幂
分析: 后面的环能不能取下来与前面的环有关,前面的环不被后面的环所影响.所以先取最后面的环 设状态F(n)表示n个环全部取下来的最少步数 先取第n个环,就得使1~n-2个环属于被取下来的状态,第n-1 ...
- Vue Element-ui表单校验规则,你掌握了哪些?
1.前言 Element-ui表单校验规则,使得错误提示可以直接在form-item下面显示,无需弹出框,因此还是很好用的. 我在做了登录页面的表单校验后,一度以为我已经很了解表单的校验规则. ...
- CentOS-Docker搭建Nextcloud
下载镜像 $ docker pull nextcloud 运行镜像 $ docker run -d --restart=unless-stopped --name nextcloud -v /home ...
- 保存TextBox中的文字为Path功能
保存TextBox中的文字为Path功能 今天再设计一个我自己程序的Icon时使用了Path+textbox做了图形,我不想导出为PNG,因为颜色比较单一,我又想通过代码控制颜色,所以我想完整的保存为 ...
- Docker 基础备忘录
Docker是一个开源的引擎,可以轻松的为任何应用创建一个轻量级的.可移植的.自给自足的容器.开发者在笔记本上编译测试通过的容器可以批量地在生产环境中部署,包括VMs(虚拟机).bare metal. ...
- Kubernetes 1.13.3 部署 Prometheus+Grafana-7.5.2(最新版本踩坑)
本教程直接在 Kubernetes 1.13.3 版本上安装 Prometheus 和 Grafana-7.5.2,至于它们的原理和概念就不再赘述,这里就直接开始操作. Git 下载相关 YAML 文 ...
- 麒麟操作系统上安装docker并加载镜像
最近需要在政务云系统中部署深度学习环境,其使用麒麟操作系统并与互联网相互隔离,无法使用常规的指令行方式进行安装.参考docker官方文档并经过多次尝试,使用离线安装的方式完成了环境的部署.这里做一下笔 ...