论坛首页 Web前端技术论坛

浏览器在线或离线状态检测

浏览 2323 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2009-05-18   最后修改:2009-05-18
firefox3和IE8均提供了离线(offline)和在线(online)事件,参考:
https://developer.mozilla.org/En/Online_and_offline_events
http://msdn.microsoft.com/en-us/library/cc304129(VS.85).aspx
据传,webkit也支持offline事件,但我没有找到相关资料。

除此以外,有没有跨浏览器的检测手段哪?比如在IE6下面如何检测浏览器已经离线,web应用需要转入离线应用状态(比如使用google gear)。

基本思路有一个:定时轮训。网络上搜索一番后发现dojo有这方面的插件:dojox.off.offline--http://www.dojotoolkit.org/book/dojo-book-0-9/part-5-dojox/dojo-offline/using-dojo-offline。 就是每隔5秒钟发一个ajax请求(向一个非常小的文本文件发请求),在超时回调里判断客户端浏览器已经离线。
	_startNetworkThread: function(){
		if(!this.doNetChecking){
			return;
		}
		window.setInterval(dojo.hitch(this, function(){	
			var d = dojo.xhrGet({
				url:	 	this._getAvailabilityURL(),
				handleAs:	"text",
				timeout: 	this.NET_CHECK * 1000,
				error:		dojo.hitch(this, 
								function(err){
									if(this.isOnline){
										this.isOnline = false;
										try{
											if(typeof d.ioArgs.xhr.abort == "function"){
												d.ioArgs.xhr.abort();
											}
										}catch(e){}
										dojox.off.sync.isSyncing = false;
										this.onNetwork("offline");
									}
								}
							),
				load:		dojo.hitch(this, 
								function(data){
									if(!this.isOnline){
										this.isOnline = true;
										this.onNetwork("online");
									}
								}
							)
			});

		}), this.NET_CHECK * 1000);
	}


应该还有其他检测手段,比如借助于flash、Silverlight、检测图片(onerror事件)等。

刚才又搜索到一个Jquery的方案:
http://jamazon.co.uk/web/2008/06/17/publish-subscribe-with-jquery/
$.networkDetection = function(url,interval){
	var url = url;
	var interval = interval;
	online = false;
	this.StartPolling = function(){
		this.StopPolling();
		this.timer = setInterval(poll, interval);
	};
	this.StopPolling = function(){
		clearInterval(this.timer);
	};
	this.setPollInterval= function(i) {
		interval = i;
	};
	this.getOnlineStatus = function(){
		return online;
	};
	function poll() {
		$.ajax({
			type: "POST",
			url: url,
			dataType: "text",
			error: function(){
				online = false;
				$(document).trigger('status.networkDetection',[false]);
			},
			success: function(){
				online = true;
				$(document).trigger(’status.networkDetection’,[true]);
			}
		});
	};
};
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics