Altın Konu HTML Web Depolama API'sı

[Epiméthé]

HTML web depolama; çerezlerden daha iyidir.

HTML5'ten önce, uygulama verilerinin her sunucu isteğine dahil olan çerezlerde saklanması gerekiyordu. Web depolaması daha güvenlidir ve büyük miktarda veri web sitesi performansını etkilemeden yerel olarak depolanabilir.

Çerezlerin aksine, depolama limiti çok daha büyüktür (en az 5MB) ve bilgiler asla sunucuya aktarılmaz.

Web depolama, kaynak başınadır (etki alanı ve protokol başına). Tek bir kaynaktan tüm sayfalar aynı verileri depolayabilir ve bunlara erişebilir.
​

Tarayıcı Desteği​

Tablodaki sayılar, Web Depolamasını tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
​

API​	​	​	​	​	​
Web Depolama​	Google Chrome: 4.0​	İnternet Edge: 8.0​	Firefox: 3.5​	Safari: 4.0​	Opera: 11.5​

​

• window.localStorage- son kullanma tarihi olmayan verileri depolar.​

Web depolamayı kullanmadan önce localStorage ve sessionStorage için tarayıcı desteğini kontrol edin.

if (typeof(Storage) !== "undefined") {
  // Code for localStorage/sessionStorage.
} else {
  // Sorry! No Web Storage support..
}

localStorage Nesnesi​

localStorage nesnesi, son kullanma tarihi olmayan verileri depolar. Tarayıcı kapatıldığında veriler silinmeyecek ve sonraki gün, hafta veya yıl içinde kullanıma sunulacaktır.
​

Örnek​

// Store
localStorage.setItem("lastname", "TurkMmo");

// Retrieve
document.getElementById("result").innerHTML = localStorage.getItem("lastname");

Örnek Açıklama:​

• name="lastname" ve value="Smith" ile bir localStorage adı/değer çifti oluşturun.​
• "Soyadı" değerini alın ve id="result" ile öğeye ekleyin​

Yukarıdaki örnek şu şekilde de yazılabilir:

// Store
localStorage.lastname = "TurkMmo";
// Retrieve
document.getElementById("result").innerHTML = localStorage.lastname;

"lastname" localStorage öğesini kaldırmak için sözdizimi aşağıdaki gibidir:

localStorage.removeItem("lastname");

Not: Ad/değer çiftleri her zaman dizeler olarak saklanır. Gerektiğinde bunları başka bir biçime dönüştürmeyi unutmayın!

Aşağıdaki örnek, bir kullanıcının bir düğmeyi kaç kez tıkladığını sayar. Bu kodda, değer dizesi, sayacı artırabilmek için bir sayıya dönüştürülür.​

Örnek​

if (localStorage.clickcount) {
localStorage.clickcount = Number(localStorage.clickcount) + 1;
} else {
localStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
localStorage.clickcount + " time(s).";

sessionStorage Nesnesi​

Nesne, verileri yalnızca bir oturum için depolaması dışında localStorage sessionStorage nesnesine eşittir.

Aşağıdaki örnek, geçerli oturumda bir kullanıcının bir düğmeyi kaç kez tıkladığını sayar.
​

Örnek​

if (sessionStorage.clickcount) {
sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1;
} else {
sessionStorage.clickcount = 1;
}
document.getElementById("result").innerHTML = "You have clicked the button " +
sessionStorage.clickcount + " time(s) in this session.";

 

[Kehanet]

Paylaşım için teşekkürler

 

[Epiméthé]

Paylaşım için teşekkürler

Rica Ederim

 

[0lumGunu]

Paylaşım için teşekkürler.

 

[Epiméthé]

Paylaşım için teşekkürler.

Rica Ederim