5

私のWebアプリケーションは、iPadのGalaxyタブなどの複数のハンドヘルドデバイスで動作します。アプリケーションはサーバーから画像を要求し、クライアントにレンダリングします。

ここで問題が発生することがあります。画像のレンダリング中にネットワーク接続が失われるという問題が発生します。そのときよりも、HTMLの画像なしアイコンがデバイスに表示されます...

この状況を適切に処理したいのですが、ネットワークが失われたときに、それをキャプチャして、ネットワーク接続などがないことをユーザーに警告したいと思います...

イベントを使用しようとしnavigator.onLineましたが、Mozillaの5〜6バージョンなど、サポートしているすべてのブラウザセットで動作していません。

また、私のアプリケーションは、wifiローカルネットワーク上でのみ実行されます...インターネットに接続されている場合と接続されていない場合があります..そのスーツでは、これもnavigator.onLine機能します..？

これを行うための他のより良い方法を教えてください...

4

2 に答える 2

2

サーバーに対して少しXHRリクエストを実行し、返されたステータスを確認できます。

の場合0、これは接続が欠落していることを意味します。

したがって、このようなものはあなたに小さな効用関数を与えることができます：

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：オブジェクトのIE準拠の部分をスキップしましたxhrが、追加するのは簡単です。これはアイデアを得るためのものです。

于 2012-04-20T16:12:36.920 に答える
2

たとえば、

<img src="..." onerror="noConnection()">

したがって、画像がロードされていない場合は、noConnectionメソッドが呼び出されます。

詳細はこちら：壊れた画像を置き換えるjQuery / JavaScript

于 2012-04-20T15:34:18.563 に答える