WebStorage: قسمت دوم
نویسنده: علی یگانه مقدم
تاریخ: ۱۳۹۴/۰۴/۰۹ ۱:۰
آدرس: www.dntips.ir
| مطالب | ۳۶۹۴ |
| نویسندگان | ۲۷۶ |
| گروههای مطالب | ۱۰۲۴ |
| نقشههای راه | ۱۱۹ |
| دورهها | ۱۴ |
| اشتراکها | ۱۷۹۱۴ |
window.localStorage window.sessionStorage
if(typeof(Storage) !== "undefined") {
// Code for localStorage/sessionStorage.
} else {
// Sorry! No Web Storage support..
} localStorage.setItem("lastname", "Smith");
//========================
localStorage.getItem("lastname"); var a=localStorage.lastname;
//ذخیره مقدار
store.set('username', 'marcus')
//بازیابی مقدار
store.get('username')
//حذف مقدار
store.remove('username')
//حذف تمامی مقادیر ذخیره شده
store.clear()
//ذخیره ساختار
store.set('user', { name: 'marcus', likes: 'javascript' })
//بازیابی ساختار به شکل قبلی
var user = store.get('user')
alert(user.name + ' likes ' + user.likes)
//تغییر مستقیم مقدار قبلی
store.getAll().user.name == 'marcus'
//بازخوانی تمام مقادیر ذخیر شده توسط یک حلقه
store.forEach(function(key, val) {
console.log(key, '==', val)
}) <script src="store.min.js"></script>
<script>
init()
function init() {
if (!store.enabled) {
alert('Local storage is not supported by your browser. Please disable "Private Mode", or upgrade to a modern browser.')
return
}
var user = store.get('user')
// ... and so on ...
}
</script> var storeWithExpiration = {
// دریافت کلید و مقدار و زمان انقضا به میلی ثانیه
set: function(key, val, exp) {
//ایجاد زمان فعلی جهت ثبت تاریخ ایجاد
store.set(key, { val:val, exp:exp, time:new Date().getTime() })
},
get: function(key) {
var info = store.get(key)
//در صورتی که کلید داده شده مقداری نداشته باشد نال را بر میگردانیم
if (!info) { return null }
//تاریخ فعلی را منهای تاریخ ثبت شده کرده و در صورتی که
//از مقدار میلی ثاینه بیشتر باشد یعنی منقضی شده و نال بر میگرداند
if (new Date().getTime() - info.time > info.exp) { return null }
return info.val
}
}
// استفاده عملی از کد بالا
// استفاده از تایمر جهت نمایش واکشی دادهها قبل از نقضا و بعد از انقضا
storeWithExpiration.set('foo', 'bar', 1000)
setTimeout(function() { console.log(storeWithExpiration.get('foo')) }, 500) // -> "bar"
setTimeout(function() { console.log(storeWithExpiration.get('foo')) }, 1500) // -> null CrossStorageHub.init([
{origin: /\.example.com$/, allow: ['get']},
{origin: /:\/\/(www\.)?example.com$/, allow: ['get', 'set', 'del']}
]); valid.example.com
invalid.example.com.malicious.com
{
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET,PUT,POST,DELETE',
'Access-Control-Allow-Headers': 'X-Requested-With',
'Content-Security-Policy': "default-src 'unsafe-inline' *",
'X-Content-Security-Policy': "default-src 'unsafe-inline' *",
'X-WebKit-CSP': "default-src 'unsafe-inline' *",
} <script type="text/javascript" src="~/Scripts/cross-storage/hub.js"></script>
<script>
CrossStorageHub.init([
{origin: /.*localhost:300\d$/, allow: ['get', 'set', 'del']}
]);
</script> var storage = new CrossStorageClient('http://localhost:3000/example/hub.html');
var setKeys = function () {
return storage.set('key1', 'foo').then(function() {
return storage.set('key2', 'bar');
});
}; storage.onConnect().then(function() {
return storage.set('key', {foo: 'bar'});
}).then(function() {
return storage.set('expiringKey', 'foobar', 10000);
}); storage.onConnect().then(function() {
return storage.get('key1');
}).then(function(res) {
return storage.get('key1', 'key2', 'key3');
}).then(function(res) {
// ...
}); storage.onConnect()
.then(function() {
return storage.get('key1', 'key2');
})
.then(function(res) {
console.log(res); // ['foo', 'bar']
})['catch'](function(err) {
console.log(err);
}); <script src="https://s3.amazonaws.com/es6-promises/promise-1.0.0.min.js"></script>
var request = indexedDB.open("library");
request.onupgradeneeded = function() {
// The database did not previously exist, so create object stores and indexes.
var db = request.result;
var store = db.createObjectStore("books", {keyPath: "isbn"});
var titleIndex = store.createIndex("by_title", "title", {unique: true});
var authorIndex = store.createIndex("by_author", "author");
// Populate with initial data.
store.put({title: "Quarry Memories", author: "Fred", isbn: 123456});
store.put({title: "Water Buffaloes", author: "Fred", isbn: 234567});
store.put({title: "Bedrock Nights", author: "Barney", isbn: 345678});
};
request.onsuccess = function() {
db = request.result;
}; var tx = db.transaction("books", "readwrite");
var store = tx.objectStore("books");
store.put({title: "Quarry Memories", author: "Fred", isbn: 123456});
store.put({title: "Water Buffaloes", author: "Fred", isbn: 234567});
store.put({title: "Bedrock Nights", author: "Barney", isbn: 345678});
tx.oncomplete = function() {
// All requests have succeeded and the transaction has committed.
}; var tx = db.transaction("books", "readonly");
var store = tx.objectStore("books");
var index = store.index("by_author");
var request = index.openCursor(IDBKeyRange.only("Fred"));
request.onsuccess = function() {
var cursor = request.result;
if (cursor) {
// Called for each matching record.
report(cursor.value.isbn, cursor.value.title, cursor.value.author);
cursor.continue();
} else {
// No more matching records.
report(null);
}
};