|
|---|
iOS 4.2が出て3か月ほど経過しました。iOS 4.2ではJavaScriptで加速度センサーを扱えるなど便利になった反面、以前に比べて不便になった面もあります。1つが、内蔵データベースであるSQLiteです。HTML5の仕様からWeb SQL Databaseが廃止されたためでしょうか、iOS 4.2ではJavaScriptからSQLiteへのアクセスができなくなりました。そのため、本連載の第2回で作成した、SQLiteを使ったGPSレコーダーは動作しなくなっています。
- JavaScriptラボ 第2回「iPhoneがJavaScript＋SQLiteでGPSレコーダーに！」
- http://ascii.jp/elem/000/000/434/434928/
今回のJavaScriptラボでは、GPSレコーダーの実装をSQLiteからlocalStorage （ローカルストレージ）に変更し、iOS 4.2でも動作させる方法を解説します。localStorageの扱いに関しては以下の記事を参照してください。
- JavaScriptラボ 第40回「サーバー不要で保存できる「Web Storage」の使い方」
- http://ascii.jp/elem/000/000/557/557064/
なお、iPhone (iOS 4.2)のlocalStorageはオリジン*1あたり最大2621391文字まで保存できます。オリジン単位での共有ですので、同一オリジンの他のページでlocalStorageを使用していると、実際に保存できるデータサイズは少なくなります。
localStorageへデータを記録する
プログラムを作る前に、どのような形でlocalStorageへ記録するかを決めましょう。localStorage はKey Value方式でデータを保存しますので、まず保存するキー名を決めます。データを一括して保存する方法もありますが、操作を誤って消去しても個別のデータが残るように、今回はGPSデータを記録した総数を「jp.ascii.gpsDataCount」、個別のGPS記録データを「jp.ascii.gpsData番号」というキー名にしました。「jp.ascii.gpsData番号」は実際にはjp.ascii.gpsData1、jp.ascii.gpsData98のようなキー名になります。
| GPSデータ総数 | jp.ascii.gpsDataCount | 数値で保存 |
| GPSデータ（個別） | jp.ascii.gpsData番号 | カンマ区切りデータで緯度、経度、時間を保存 |
記録するデータが決まったのでプログラムの作成に入りましょう。Webページが読み込まれたら、記録されているGPSデータの総数を読み出します。
var count = window.localStorage.getItem("jp.ascii.gpsDataCount") || 0;
このとき、GPSデータがまったく記録されていないと、window.localStorage.getItem("jp.ascii.gpsDataCount")はnullとなり、変数countの値もnullになってしまいます。そこで、|| 0 を追加して、nullの場合は変数countに0が入るようにします。
||は条件式での論理和であり、||の左右どちらかが真であれば条件を満たしたことになります。この場合、必ず左側の式から真偽がチェックされていき、偽以外の値であればそこでチェックが終了します。たとえば以下の場合、変数aには12が入ります。
a = null || undefined || 12;
以下はどうでしょうか。この場合も変数aには12が入ります。12の部分で条件を満たした（真である）ことになるので、以後に続く部分はチェックされないのです。
a = null || 12 || 34;
ちなみに、
var count = window.localStorage.getItem("jp.ascii.gpsDataCount") || 0;
は以下のように書いても同じ結果になります。
var count = window.localStorage.getItem("jp.ascii.gpsDataCount"); if (!count){ count = 0; }
localStorageから読み出したGPSデータの総数をアラートダイアログに表示すると以下のようになります。
var count = window.localStorage.getItem("jp.ascii.gpsDataCount") || 0; alert("データは"+count+"個記録されています");
*1 オリジン＝プロトコル+ドメイン+ポート番号
