开发离线应用的第一步是要知道设备是在线还是离线,html5为此定义了一个navigator.onLine属性,这个属性值为true表示设备能上网,值为false表示设备离线。这个属性的关键是浏览器必须知道设备能否访问网络,从而返回正确的值。实际应用中,navigator.onLine在不同的浏览器间还有些小差异。
IE6 和safari5 能够正确的检测到网络已断开,并将navigator.onLine的值转换为false。
firefox3 和opera10.6 支持navigator.onLine属性,但你必须手工选中菜单项“文件”——脱机工作“才能让浏览器正常工作。
chrome11及之前版本始终将navigator.onLine属性不能确定网络是否连通。即使如此在请求发生错误的情况下,检测这个属性仍然是管用的。以下是检测该属性状态的示例。
if(navigator.onLine){
//正常工作
}else{
//执行离线状态时的任务
}
除navigator.onLine属性之外,为了更好地确定网络是否可用,html5还定义了两个事件:online和offline。当网络从离线变为在线或者从在线变为离线时,分别触发这两个事件。这两个事件在window对象上触发。
EventUtil.addHandler(window,"online",function(){
alert("Online");
});
EventUtil.addHandler(window,"offline",function(){
alert("Offline");
})
为了检测应用是否离线,在页面加载后,最好先通过navigator.onLine取得初始的状态。然后,就是通过上述两个事件来确定网络连接状态是否变化。当上述事件触发时,navigator.onLine属性的值也会改变,不过必须要手工轮询这个属性才能检测到网络状态的变化。
支持离线检测的浏览器有IE6 (只支持navigator.onLine属性).Firefox3、safari 4、Opera 10.6、chrome、ios 3.2版safari和android版webkit.
转载请注明:前端录»离线检测
<script src="http://www.wozhuye.com/index.php?m=digg&c=index&a=init&id=15-51-2"></script>