HTML 5 Dersleri – Bölüm 6 – Web depolama

HTML 5 Dersleri – Bölüm 6 – Web depolama

İstemcide veri depolama

HTML5 istemcide(client) veri depolama için iki yeni nesne sunmakta;

localStorage – zaman limitsiz depolama

sessionStorage – bir oturumluk depolama

Öncelinde, çerezlerle gerçekleşiyordu bu durum. Çok büyük veriler için de çerezler(cookies) uygun değil, çünkü her bir istekte sunucudan geçmekte bu da işlemin çok yavaş ve etkisi düşük kılıyordu.

HTML5’te, her sunucu isteğinde veri çağırılmamakta sadece sorulduğunda çağırılmakta. Böylelikle site performansı etkilenmeden büyük miktarlarda veri depolaması mümkün olmakta.

Veriler farklı web sitelerin farklı alanlarında depolanmakta ve bir websitesi kendi depoladığı veriye erişebilir.

HTML5 Javascript’i kullanarak verileri depolar ve ulaşır/erişir.

localStorage Nesnesi

Zaman limitsiz veri depolama nesnesidir. Veri sonraki gün, hafta ya da yıl erişilebilir olacaktır.

Nasıl oluşturur ve erişirsiniz?;

<script type="text/javascript">
localStorage.lastname="Smith";
document.write(localStorage.lastname);
</script>

denemek için adresi; 

bu sıradaki örnek ise kullanıcının sayfa ziyaretini saymakta;

<script type="text/javascript">
if (localStorage.pagecount)
  {
  localStorage.pagecount=Number(localStorage.pagecount) +1;
  }
else
  {
  localStorage.pagecount=1;
  }
document.write("Visits "+ localStorage.pagecount + " time(s).");
</script>

denemek için adresi;

sesssionStorage Nesnesi

Bir oturumluk veri depolar. Kullanıcı tarayıcısını kapatıp çıkış yaptığında depolanan veri silinir.

Nasıl oluşturur ve erişim sağlarsınız bir sessionStorage ile?;

<script type="text/javascript">
sessionStorage.lastname="Smith";
document.write(sessionStorage.lastname);
</script>

denemek için adresi;

Sıradaki örnek de kullanıcının sayfa ziyaretini saymakta, varsayılan oturumda;

<script type="text/javascript">
if (sessionStorage.pagecount)
  {
  sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;
  }
else
  {
  sessionStorage.pagecount=1;
  }
document.write("Visits "+sessionStorage.pagecount+" time(s) this session.");
</script>

denemek için adresi;

Sıradaki  3 ders form elemanlarına ait olacak.

Yararlı olması dileğiyle…