Apache Cordovaでデータを保存する方法

こんにちは！ぐちです。

アプリ開発

PPJやってますか？！PPJとは僕が勝手に名付けたものです。その名も・・・Private Project！笑
どうでもいいですね！

こちらの実況シリーズでも投稿しているように最近はApache Cordovaを使ってスマホアプリを作っています。プライベートの時間しか使えないのでなかなか思うように進まないのですがなんとか頑張ります！

Cordovaのストレージ

アプリ内にデータを保存したいときってありますよね？そんな時にWebの技術をベースとしているCordovaであればSessionなどもさくっと使うことができます。

もちろん一時的な保存ではなく永続的な保存も簡単に実現することができます。

標準で準備されているストレージへのIFとして下記の二つがあります。

window.localStorage

こちらはローカルストレージへのアクセスを提供するIFで下記のようなIFがあります。データの保存はkey-valueのペアで行います。アプリデータを削除するか明示的にkeyを指定して削除する以外は永続的に保存されます。

setItem(“key”, “value”)
- 値を保存します。
getItem(“key”)
- keyを指定して値を取得します。
removeItem(“key”)
- keyを指定して値を削除します。
clear()
- 全てのkey-valueのペアを削除します。

// データ保存
window.localStorage.setItem('hoge', 'value');
// データ取得
var hoge = window.localStorage.getItem('hoge');
// データ削除
window.localStorage.removeItem('hoge');
// 全データクリア
window.localStorage.clear();

window.sessionStorage

localStorageと同じIFが提供されていますがこちらは永続的なデータの保存ではなく一時的な保存に限られます。
アプリが起動されるたびにデータは削除されますので実行中のみ保持しておきたいデータの保存に利用しましょう。

上記のコードのlocalStorageの部分がsessionStorageに変わるだけでIFは全て同じです。

非常にシンプルで簡単に使えますよね！

JSON

オブジェクト等はJSONフォーマットに変換してストレージに保存するのが良いとされています。僕は下記のように保存、取得のタイミングでJSONフォーマットに変換しています。もっと良い方法ないですかね。。。

// 取得時はJSONフォーマットからオブジェクトへ変換する
JSON.parse(window.localStorage.getItem('hoge'));
// 保存時はオブジェクトからJSONフォーマットヘ変換する
window.localStorage.setItem('hoge', JSON.stringify(obj));

localStorageやsessionStorage以外にもSQLiteへのアクセスも可能です。こちらはまた別の機会にご紹介したいと思います。