12月, 2019 | senmyou's blog

NativeStorageプラグインを使用するとアプリのデータを永続的に保存できます。Androidの場合はSharedPreferences、iOSの場合はNSUserDefaultsを利用します。データはローカルストレージ（LocalStorage）と同様にKey-Value形式で扱います。

NativeStorageプラグイン： cordova-plugin-nativestorage

API

const key = "message";
const value = "hello";
const successCallback => console.log("success");
const errorCallback => console.log("error");

// 保存
NativeStorage.setItem(key, value, successCallback, errorCallback);

// 読み出し
NativeStorage.getItem(key, successCallback, errorCallback);

// 読み出し（全キー）
NativeStorage.keys(successCallback, errorCallback);

// 削除
NativeStorage.remove(key, successCallback, errorCallback);

// 全削除
NativeStorage.clear(successCallback, errorCallback);

動作確認サンプル

<body>
  <div id="container">
    <ons-button onclick="onLoad()">Load</ons-button>
    <ons-button onclick="onSave()">Save</ons-button>
  </div>
</body>

// key
const KEY_NUMBERS = "nsNums";
const KEY_RECORDS = "nsRecords";

// value
const numbers = [100, 200, 300, 400, 500];  // 配列
const records = {     // オブジェクト
  "date": {
    "year": 2019,
    "month": 11,
    "day": 16,
    "week": 1
  },
  "time": [
    {"hour": 7, "min": 10},
    {"hour": 9, "min": 20},
    {"hour": 11, "min": 30},
    {"hour": 15, "min": 40},
    {"hour": 20, "min": 50}
  ]
};

ons.ready(function () {   // devicereadyイベント
  console.log("*** ons.ready ***");
  console.log(window.NativeStorage);
})

function onLoad () {
  console.log("*** onLoad ***");

  NativeStorage.getItem(KEY_NUMBERS, 
    obj => console.log("success", obj),
    err => console.log("error", err.code));

  console.log("check1");

  NativeStorage.getItem(KEY_RECORDS, 
    obj => console.log("success", obj),
    err => console.log("error", err.code));

  console.log("check2");
}

function onSave () {
  console.log("*** onSave ***");
  
  NativeStorage.setItem(KEY_NUMBERS, numbers,
    obj => console.log("success", obj),
    err => console.log("error", err.code));

  console.log("check1");

  NativeStorage.setItem(KEY_RECORDS, records, 
    obj => console.log("success", obj),
    err => console.log("error", err.code));

  console.log("check2");
}

console 出力

ローカルストレージとの相違点

アプリ起動時の読み込み

Cordovaの初期化が終わってから（devicereadyイベントリスナ―やons.ready()メソッドで）実行する
ローカルストレージの場合はどこで読み込んでもよい

非同期処理

データを読み出した後の処理はコールバックで行う
複数のキーを順に呼び出したりFile APIのような非同期処理を続けて行うときはPromiseなどを使用するとソースコードが見やすくなる
ローカルストレージの場合は同期処理なので記述した順番に実行される

データ形式

オブジェクトや配列のデータを保存したり読み出したりする場合、そのままの形式で扱うことができる
ローカルストレージの場合はJSON形式の文字列で扱う必要がある（保存する前にJSON.stringify()で文字列に、読み出した後はJSON.parse()でオブジェクトに変換）

Note

SharedPreferencesへのアクセスモードはMODE_PRIVATE固定

NativeStorageプラグインでは他のアプリとのデータ共有は不可。そもそもSharedPreferences APIではAPI level23からMODE_MULTI_PROCESSがサポートされなくなったため、データ共有したい場合はSharedPreferencesの替わりにContentProviderなどを使用する必要がある。

アプリを再インストールしてもデータが消えない

アプリをアンインストールした後に再インストールした場合、SharedPreferencesに保存したデータは自動的に復元される。保存したデータが設定値であれば再設定する手間が省けるなど便利な面もあるが、スコアや過去の日付のような初期化したいデータの場合はクリーンな状態から始めることができなくなる。

これは、Androidの自動バックアップ機能が原因。

この機能により、SharedPreferencesがGoogle Driveへ自動的に保存され、再インストールしたときに自動的に復元される。この機能を無効化するには、アプリのマニフェストファイルにandroid:allowBackup=”false”を記述する。Monacaを使用している場合はAndroidManifest.xmlの替わりにconfig.xmlとCustom Configプラグインを使用する。

月: 2019年12月

Cordova NativeStorageプラグインでデータを保存

API