master。

cordova-plugin-network-information

このプラグインは、古いバージョンのネットワーク情報APIの実装を提供します。デバイスの携帯電話およびWi-Fi接続に関する情報、およびデバイスがインターネットに接続されているかどうかを提供します。

プラグインの使用方法についていくつかのアイデアを得るには、このページの下部にあるサンプルを確認するか、リファレンスの内容に直接進んでください。

インストール

cordova plugin add cordova-plugin-network-information

サポートされているプラットフォーム

Android
ブラウザ
iOS
Windows

接続

navigator.connectionを介して公開されるconnectionオブジェクトは、デバイスの携帯電話およびWi-Fi接続に関する情報を提供します。

プロパティ

connection.type

定数

Connection.UNKNOWN
Connection.ETHERNET
Connection.WIFI
Connection.CELL_2G
Connection.CELL_3G
Connection.CELL_4G
Connection.CELL
Connection.NONE

connection.type

このプロパティは、デバイスのネットワーク接続状態と接続の種類を迅速に判断するための簡単な方法を提供します。

クイック例

function checkConnection() {
    var networkState = navigator.connection.type;

    var states = {};
    states[Connection.UNKNOWN]  = 'Unknown connection';
    states[Connection.ETHERNET] = 'Ethernet connection';
    states[Connection.WIFI]     = 'WiFi connection';
    states[Connection.CELL_2G]  = 'Cell 2G connection';
    states[Connection.CELL_3G]  = 'Cell 3G connection';
    states[Connection.CELL_4G]  = 'Cell 4G connection';
    states[Connection.CELL]     = 'Cell generic connection';
    states[Connection.NONE]     = 'No network connection';

    alert('Connection type: ' + states[networkState]);
}

checkConnection();

iOS特有の動作

iOS7より前は、携帯電話ネットワーク接続の種類を検出できません。
- すべての携帯電話データに対して、navigator.connection.typeはConnection.CELLに設定されます。

Windows特有の動作

Phone 8.1エミュレーターで実行している場合、常にnavigator.connection.typeをConnection.ETHERNETとして検出します。

ブラウザ特有の動作

ブラウザはネットワーク接続の種類を検出できません。オンラインの場合、navigator.connection.typeは常にConnection.UNKNOWNに設定されます。

ネットワーク関連イベント

offline

アプリケーションがオフラインになり、デバイスがインターネットに接続されていない場合に、このイベントが発生します。

document.addEventListener("offline", yourCallbackFunction, false);

詳細

offlineイベントは、接続されていたデバイスがネットワーク接続を失い、アプリケーションがインターネットにアクセスできなくなった場合に発生します。これはConnection APIと同じ情報に依存しており、connection.typeの値がNONEになったときに発生します。

アプリケーションは通常、devicereadyイベントが発生した後にイベントリスナーをアタッチするためにdocument.addEventListenerを使用する必要があります。

クイック例

document.addEventListener("offline", onOffline, false);

function onOffline() {
    // Handle the offline event
}

特有の動作

このプラグインは、バックグラウンドではイベントをブロードキャストできません。resumeイベントでnavigator.connection.typeを使用して接続状態を確認してください。

iOS特有の動作

初回起動時、最初のofflineイベント（該当する場合）は、発生するまでに少なくとも1秒かかります。

online

アプリケーションがオンラインになり、デバイスがインターネットに接続された場合に、このイベントが発生します。

document.addEventListener("online", yourCallbackFunction, false);

詳細

onlineイベントは、接続されていなかったデバイスがネットワーク接続を受け取り、アプリケーションがインターネットにアクセスできるようになった場合に発生します。これはConnection APIと同じ情報に依存しており、connection.typeがNONEから他の値に変更されたときに発生します。

クイック例

document.addEventListener("online", onOnline, false);

function onOnline() {
    // Handle the online event
}

特有の動作

iOS特有の動作

初回起動時、最初のonlineイベント（該当する場合）は、発生するまでに少なくとも1秒かかります。その前までは、connection.typeはUNKNOWNです。

サンプル：ネットワーク状態に応じてファイルをアップロードする

このセクションのコード例は、onlineおよびofflineイベントとネットワーク接続状態を使用してアプリの動作を変更する例を示しています。

まず、サンプルデータに使用する新しいFileEntryオブジェクト（data.txt）を作成します。この関数をdevicereadyハンドラーから呼び出します。

注記このコード例では、Fileプラグインが必要です。

var dataFileEntry;

function createSomeData() {

    window.requestFileSystem(window.TEMPORARY, 5 * 1024 * 1024, function (fs) {

        console.log('file system open: ' + fs.name);
        // Creates a new file or returns an existing file.
        fs.root.getFile("data.txt", { create: true, exclusive: false }, function (fileEntry) {

          dataFileEntry = fileEntry;

        }, onErrorCreateFile);

    }, onErrorLoadFs);
}

次に、devicereadyハンドラーでonlineおよびofflineイベントのリスナーを追加します。

document.addEventListener("offline", onOffline, false);
document.addEventListener("online", onOnline, false);

アプリのonOnline関数は、onlineイベントを処理します。イベントハンドラーで、現在のネットワーク状態を確認します。このアプリでは、Connection.NONEを除くすべての接続タイプを良好な状態として扱います。接続がある場合は、ファイルをアップロードしようとします。

function onOnline() {
    // Handle the online event
    var networkState = navigator.connection.type;

    if (networkState !== Connection.NONE) {
        if (dataFileEntry) {
            tryToUploadFile();
        }
    }
    display('Connection type: ' + networkState);
}

上記のコードでonlineイベントが発生した場合は、アプリのtryToUploadFile関数を呼び出します。

アップロードに失敗した場合は、アプリのofflineWrite関数を呼び出して現在のデータをどこかに保存します。

注記簡単にするために、ファイルの読み書きは省略しました。ファイル処理の詳細については、cordova-plugin-fileのドキュメントを参照してください。

function tryToUploadFile() {
    // !! Assumes variable fileURL contains a valid URL to a text file on the device,
    var fileURL = getDataFileEntry().toURL();
    
    getFileBlobSomehow(fileURL, function(fileBlob) {
        var success = function (r) {
            console.log("Response = " + r.response);
            display("Uploaded. Response: " + r.response);
        };

        var fail = function (error) {
            console.log("An error has occurred: Code = " + error.code || error.status);
            offlineWrite("Failed to upload: some offline data");
        }

        var xhr = new XMLHttpRequest();

        xhr.onerror = fail;
        xhr.ontimeout = fail;
        xhr.onload = function() {
            // If the response code was successful...
            if (xhr.status >= 200 && xhr.status < 400) {
                success(xhr);
            }
            else {
                fail(xhr)
            }
        }

        // Make sure you add the domain of your server URL to the
        // Content-Security-Policy <meta> element in index.html.
        xhr.open("POST", encodeURI(SERVER));

        xhr.setRequestHeader("Content-Type", "text/plain");

        // The server request handler could read this header to
        // set the filename.
        xhr.setRequestHeader("X-Filename", fileURL.substr(fileURL.lastIndexOf("/") + 1));

        xhr.send(fileBlob);
    });
};

offlineWrite関数のコードを次に示します。

注記このコード例では、Fileプラグインが必要です。

function offlineWrite(offlineData) {
    // Create a FileWriter object for our FileEntry.
    dataFileEntry.createWriter(function (fileWriter) {

        fileWriter.onwriteend = function () {
            console.log("Successful file write...");
            display(offlineData);
        };

        fileWriter.onerror = function (e) {
            console.log("Failed file write: " + e.toString());
        };

        fileWriter.write(offlineData);
    });
}

offlineイベントが発生した場合は、ユーザーに通知するなどを行います（この例では、単にログに記録します）。

function onOffline() {
    // Handle the offline event
    console.log("lost connection");
}