我的Web应用程序适用于多种手持设备,如iPad Galaxy选项卡等.应用程序从服务器请求图像并在客户端上呈现.
现在问题有时发生,在渲染图像期间网络连接丢失,而不是设备上显示html无图像图标的时间……
我想优雅地处理这种情况,在网络丢失的时候,我想捕获它并向用户显示没有网络连接或其他东西的警报……
我尝试使用navigator.onLine事件..但它不支持我支持的所有浏览器集,mozilla等5-6版本.
而且我的应用程序将只在wifi本地网络运行…可能或可能没有连接到互联网..将在该诉讼中也这个navigator.onLine工作..?
请提供给我任何其他更好的方法来做到这一点……
最佳答案
您可以对服务器执行一些XHR请求并检查返回的状态.
如果为0,则表示the connection is missing.
所以,像这样的东西可以给你一点实用功能:
function isOnline ( callback ) {
var xhr = new XMLHttpRequest( )
xhr.onreadystatechange = function ( ) {
// Make sure the request is finished
if ( xhr.readyState === 4 ) {
// There is the magic
if ( xhr.status === 0 ) {
callback( false )
}
else {
callback( true )
}
}
}
xhr.open( '/some/url' )
xhr.send( )
}
// Usage example:
isOnline( function ( status ) {
if ( status ) {
// You're online
}
else {
// You're not online
}
} )
PS:我跳过了xhr对象的IE兼容部分,但它很容易添加.这更像是为了得到这个想法.