文档章节

Ajax的同步调用场景——使用同步Ajax在 onunload 事件时通知服务器

sheilacat
 sheilacat
发布于 2015/03/19 16:06
字数 1048
阅读 19
收藏 0

在一种场景下,server端维护了浏览器客户端的状态信息,当浏览器关闭时需要立刻通知server用户已经离开了,server端好清 理状态。这种情况的典型案例就是:浏览器客户端的即时通信,即web IM。因为用户关闭了窗口就表明用户已经不在线了,所有对话都结束了,server端和对话的另一方需要立刻知道这个状态变化。而一般情况 下,server端并不需要立刻通知的情况,那就无所谓了,只要过期超时即可。


要想在用户关闭浏览器后,server端得到通知,一般有两种做法:

方法一: 通过 javascript 轮询的方式向 server 发送心跳(使用异步ajax),server端记下上次心跳时间,server端Timer定期检查会话的心跳时间是否超时来判断用户是否已经离开了。这 种方法的缺点是,要想即时通知就得把心跳间隔时间设得短,server端检查的时间也要短,这样会导致server端的负担大大增加,所能承载的用户就会 较少。

方法二:不采用发送心跳的方式,而是在用户关闭浏览器时,通知server即可。这样server端的负担就小了。

window.onunload = function(){

ajax.callServer();

}


重点说一下方法二的实现。

首先,页面上注册 onunload 事件。如 body元素的 onunload 属性,或直接设置 window.onunload 。

注意是 onunload 而不是 onbeforeunload 事件,因为用户可以在 onbeforeunload 事件时选择“取消”从而不关闭窗口,而onunload 事件意味着窗口肯定是要被关闭的。


其次,在onunload事件中调用同步的ajax请求通知server,而非默认的异步ajax请求。 因为调用异步的ajax请求在一些浏览器下无法真正使server得到通知,实际上根本无法保障!在发出了这个异步请求之后,浏览器就要关闭窗口并清理所 有相关资源,因为这是异步请求,所以浏览器有理由认为无需等待该请求完成即可开始关闭窗口,这样该请求就可能失败(IE上就是这样,用异步请求无法通知到 server)。这也解释了为什么异步callServer()调用后面再加个alert语句就没问题了,因为alert语句在后面挡着,需要人来点确 认,所以可以完成对server的请求。而用同步的ajax请求则浏览器会等待该请求完成后才关闭窗口清理资源,因而就不会有这个问题。


这 就是一种使用同步ajax的场景,ajax中第一个a指的是 asynchronous 异步,当初引入ajax的主要目的就是引入一种异步执行的方法,绝大部分情况下应该使用异步方式执行ajax。同步ajax也许应该叫做 sjax ( s 是 synchronously)。

XMLHttpRequest 的 open 方法中的第三参数表示是同步还是异步,xmlHttp.open("GET", url, true); 各种支持Ajax的框架,如prototype、ext、dwr等肯定都有选项设置是否为异步模式。


最后,实际情况的做法是要结合方法一和方法二。 方法二由于各种原因(比如用户电脑突然停电、浏览器崩溃等,这你总没办法吧),总是难免浏览器在关闭时没有成功的通知server。尽管是少数情况,但 server端是要保证长期运行稳定的,要避免资源泄漏,所以必然server端还是需要定期检查会话是否过期的。但因为已经保证了大部分情况下 server得到了通知,所以server端的定期检查可以时间长一些,心跳间隔也可以时间长一些(但要小于server检查的时间间隔),因而对 server也不造成什么负担。


相关参考资料:

Snippets: Synchronous AJAX: http://www.hunlock.com/blogs/Snippets:_Synchronous_AJAX

Making AJAX calls onUnload: http://www.livelearncode.com/archives/11


本文转载自:http://han.guokai.blog.163.com/blog/static/1367182712010593264536/

sheilacat
粉丝 35
博文 75
码字总数 35249
作品 0
长沙
程序员
私信 提问
小白来实现一个Ajax请求[Ajax使用方法及相关知识点详细解析——超级全]

写在前面: 本文主要总结整理Ajax使用方法背景知识点的详细解析,以及Ajax跨域的具体使用方式并且对栗子进行了讲解,需要的朋友可以过来参考下,喜欢的可以点波赞,或者关注一下本人,希望通...

OB丶Koro1
2017/06/01
0
0
js原生Ajax 的封装和原理之浅析

原理及概念 AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是一种用于创建快速动态网页的技术。 动态网页:是指可以通过服务器语言结合数据库随时修改数据的网页。 静...

sinat_34719507
2017/03/11
0
0
AJAX基础之JavaScript基础与增强(二)

一,Ajax究竟是个什么东西 用来描述一组技术,它使浏览器可以为用户提供更为自然的浏览体验。 简单一句话 不刷新页面与服务器通讯的技术 在Ajax之前,Web站点强制用户进入提交/等待/重新显示...

architect刘源源
2018/05/08
11
0
如何在 Web 关闭页面时发送 Ajax 请求

有时候我们需要在用户离开页面的时候,做一些上报来记录用户行为。又或者是发送服务器ajax请求,通知服务器用户已经离开,比如直播间内的退房操作。 本文主要分两部分来讲解怎么完成退出行为...

腾讯IVWEB团队
03/05
0
0
Ajax的原理和应用(给公司做所的培训)

在写这篇文章之前,曾经写过一篇关于AJAX技术的随笔,不过涉及到的方面很窄,对AJAX技术的背景、原理、优缺点等各个方面都很少涉及null。这次写这篇文章的背景是因为公司需要对内部程序员做一...

韩金星
2013/06/15
412
0

没有更多内容

加载失败,请刷新页面

加载更多

MongoDB系列-解决面试中可能遇到的MongoDB复制集(replica set)问题

关注我,可以获取最新知识、经典面试题以及微服务技术分享   MongoDB复制集(replica set):MongoDB复制集维护相同数据集的一组mongod进程,复制集是生产部署的基础,具有数据冗余以及高可用...

ccww_
33分钟前
4
0
SpringBoot系列:Spring Boot集成Spring Cache,使用RedisCache

前面的章节,讲解了Spring Boot集成Spring Cache,Spring Cache已经完成了多种Cache的实现,包括EhCache、RedisCache、ConcurrentMapCache等。 这一节我们来看看Spring Cache使用RedisCache。...

杨小格子
42分钟前
3
0
OpenJDK之CountDownLatch

OpenJDK8,本人看的是openJDK。以前就看过,只是经常忘记,所以记录下 图1 CountDownLatch是Doug Lea在JDK1.5中引入的,作用就不详细描述了, await()方法,如果还有线程在执行,那么当前线程...

克虏伯
48分钟前
4
0
简单编程

1.编写一个程序,提示用户输入名和姓,然后以“名,姓”的格式打印出来。 #include<stdio.h>int main(){char name[3];char family[3];printf("Please input your name and family:\n...

电子工程197沈志初
52分钟前
4
0
详解Mysql分布式事务XA(跨数据库事务)

在开发中,为了降低单点压力,通常会根据业务情况进行分表分库,将表分布在不同的库中(库可能分布在不同的机器上)。在这种场景下,事务的提交会变得相对复杂,因为多个节点(库)的存在,可...

slagga
57分钟前
5
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部