appMobi ローカルストレージ
急にPCが壊れて早３週間。。。
appMobiが復活しましたv(￣Д￣)v ｲｴｲ
ってことで久しぶりに書きます(ﾉ´∀｀*)
今日書くのはローカルストレージについてです。
appMobiで作ったアプリ…
作ったのはいいが、状態保存できないかなぁ〜
ローカルで保存できる方法ないかなぁ〜
う〜ん。。。(；´∀｀)
ローカルストレージとは…
操作しているコンピュータに直接つながれたハードディスクなどの外部記憶装置。また、その中に設けられた特定のソフトウェアのためのデータ保存領域。
これだ！！！
という経緯でローカルストレージの勉強することになりました。
「え？ローカルストレージってあるの？」
いろいろ探してみると。。。Cookie が使える！！
「Cookie使えば、できるんじゃね！？」
つまり、appMobiのローカルストレージはCookieを使うことで実装可能となるのです(∩´∀｀)∩ﾜｰｲ
でも実は…
HTML5にもローカルストレージという機能があるんですよ( ´ﾉД｀)ｺｯｿﾘ
うまく動作しないとか何とか、、、やってないのでわかりません( ｰ`дｰ´)ｷﾘｯ
【重要】誰か確かめてやったら教えてください(・∀・)←
さて、では実際にappMobiでCookieはどう使っているのか？
まず見てもらいたいのは demo.CookieManagement と言うアプリです。
[add]してCookieを作成し、[delete]でクッキーモンスターがCookieを消しちゃうってアプリ(・∀・)
面白いｗｗｗ
そしてCookieを使う上でもっとも利用するアプリ(ﾉ´∀｀*)
1.Cookieがちゃんと入ったのかの確認。
2.いらなくなったCookieの削除。
3.自分の手でCookieの追加。
などなど、、、このアプリを利用する機会がものすごーく増えるでしょう(≧ω≦。)プププ
あ、appMobiで使用されるCookieはすべて同じ所に保存されているので（どこかは知らない）アプリ一つ一つにCookieがあるわけではありません( ｰ`дｰ´)ｷﾘｯ
では、早速このCookieManagemetのソースでどうやってCookieを追加、表示、削除をしているのかを見てみましょう！
419 <div style='position:absolute;top:190px;left:20px'>
420 <span class='categoryHead'>Cookie Value: </span>
421 <span class='categoryCopy' id='cookieValue'> </span>
422 </div>
423 <!-- delete button-->
424 <a style='position:absolute;top:258px;left:402px'onMouseOut="document.getElementById('imgDelete').src='delete_button_up.png'" onMouseUp="document.getElementById('imgDelete').src='delete_button_up.png'" onMouseDown="document.getElementById('imgDelete').src='delete_button_press.png'" onclick="deleteCookie();"><image id='imgDelete' src='delete_button_up.png'/></a><br>
425 <!-- add button-->
426 <a style='position:absolute;top:258px;left:582px' onMouseOut="document.getElementById('imgAdd').src='add_button_up.png'" onMouseUp="document.getElementById('imgAdd').src='add_button_up.png'" onMouseDown="document.getElementById('imgAdd').src='add_button_press.png'" onclick="addCookie();"><image id='imgAdd' src='add_button_up.png'/></a><br>色々書いているけど、、、とりあえず、追加から！！
426行目のaddCookie();に注目。
この関数はどこにあるかというと、、、
182 function addCookie() {
183 //add a cookie
184 var name = prompt('Enter cookie name:');
185 if( name.length == 0) return;
186 var value = prompt('Enter cookie value:');
187 var daysTillExpiry = prompt('Days until cookie expires (-1 fornever):');
188 try
189 {
190 AppMobi.cache.setCookie(name,value,parseInt(daysTillExpiry));
191 }
192 catch(e)
193 {
194 alert("error in setCookie: " + e.message);
195 }
196 updateDropdown();
197 }184〜187行目はname,value,daysTillExpiryに値を入れている。
大事なのは AppMobi.cache.setCookie(name,value,parseInt(daysTillExpiry));
とりあえず、APIで確認( ´∀｀)bｸﾞｯ!
第１引数：ユニークな名前。
第２引数：データ
第３引数：保存期間
ってことですね。この３つの引数でCookieを追加することができます。
ふぅ…疲れてきたので削除と表示は省略しましょうかｗｗｗ
(deleteCookie()関数) 204 AppMobi.cache.removeCookie(name); (showCookie()関数) 221 AppMobi.cache.getCookie(selectedText);
まず cache.removeCookie から見てみようﾜｰｲヽ(ﾟ∀ﾟ)ﾒ(ﾟ∀ﾟ)ﾒ(ﾟ∀ﾟ)ﾉﾜｰｲ
・登録されているCookieのユニークな名前を引数にすることで、そのCookieを削除できる。
次は cache.getCookie を見る！
・登録されているCookieのユニークな名前を引数にすることで、value(データ)を取り出すことができる
え〜と、、、
一応この３つがあれば追加、削除、表示はできます！
AppMobi.cache.setCookie
AppMobi.cache.getCookie
AppMobi.cache.removeCookie
を使って、なにか作ってみようかね(ﾉｼ｀･ω･)ﾉｼ ﾊﾞﾝﾊﾞﾝ
