Web Storage を用いたユーザーデータの操作 - Firefox OS アプリプログラミング
概要
アプリケーションを作成していく上で、ユーザーID や各種設定といった小さなデータを、永続的または非永続的に保持しておく必要がしばしば発生します。このような要件を、Firefox OS では、Web Storage を用いて実現することができます。
Web Storage は、
- sessionStorage
- localStorage
の二つのオブジェクトとして実装されています。前者は、アプリが終了するまで、後者はアプリが終了しても永続的にデータを保持することができます。Web Storage には同一生成元ポリシーが適用され、異なるアプリ間でデータを共有することはできません、たぶん(未確認)
sessionStorage と localStorage には、どちらも以下のほぼ同様なメソッドが用意されています。
- getItem('key'); // key キーの値を取得
- setItem('key', value); // key キーに value 値をセット
- removeItem('key') // キー・値の組を削除
- clear(); // 全てのキー・値の組を削除
実装
ユーザーにユーザー名を入力してもらい、ユーザー名を保存しておくようなアプリを実装してみます。manifest.webapp は適当に作ります。Web Storage を使うための特別な権限設定は必要ありません。
このテストアプリでは、ユーザー名が設定されていなければ、ユーザー名の入力ダイアログを出力し、ユーザー名を入力してもらいます。ユーザー名が既に設定されていれば、そのユーザー名を出力し、ユーザー名の設定を削除します。普通こんなケースは無いでしょうが、まぁテストなので。
これを実装したのが、以下の HTML ファイルです。
<html>
<head>
<meta charset="utf-8">
<title>Web Storage Test Page</title>
</head>
<body>
<script>
const USER_NAME_KEY = 'user_name_key';
var userName = localStorage.getItem(USER_NAME_KEY);
if (userName !== null) {
alert(userName);
// delete user name for localStorage test.
localStorage.removeItem(USER_NAME_KEY);
} else {
var newUserName = prompt('Please Enter Username', '');
// set use name to localStorage.
localStorage.setItem(USER_NAME_KEY, newUserName);
}
</script>
</body>
</html>
今回は localStorage を用いましたが、ここを sessionStorage に読み替えても同様に動きます。
スクリーンショット。
Author And Source
この問題について(Web Storage を用いたユーザーデータの操作 - Firefox OS アプリプログラミング), 我々は、より多くの情報をここで見つけました https://qiita.com/iizukak/items/93a457e9ffff7122311b著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .