[[oktatas:web:javascript|< JavaScript]]

====== JavaScript - Tárolás kliens oldalon ======

  * **Szerző:** Sallai András
  * Copyright (c) 2022, Sallai András
  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
  * Web: https://szit.hu

===== window.localStorage =====

Adatok tárolása lejárati dátum nélkül.

Függvények:
  * localStorage.setItem()
  * localStorage.getItem()
  * localStorage.removeItem()


Használatra példa:
<code javascript>
localStorage.setItem("valami", "adat");
</code>

<code javascript>
localStorage.valami = "adat";
</code>



<code javascript>
var valami = localStorage.getItem("valami");
</code>

<code javascript>
localStorage.removeItem("valami");
</code>



Használat előtt érdemes ellenőrizni, hogy a böngésző képes-e használni:

<code javascript>
if (typeof(Storage) !== "undefined") {
  // Ide jöhet a localStorage/sessionStorage kód.
} else {
  // Ide jöhet a figyelmeztetés, hogy a böngésző nem támogatja.
}
</code>

==== Objektum tárolása ====
Az objektumot sztringesítve tároljuk, másként nem kapjuk meg a tagokat.
<code javascript>
function setData() {
    let emp = {
        name: 'Valaki',
        city: 'Szeged',
        salary: 345
    }
    localStorage.setItem('emp', JSON.stringify(emp))
}

function getData() {
    let empStr = localStorage.getItem('emp')
    let emp = JSON.parse(empStr)
    console.log(emp.name)

}
</code>


===== window.sessionStorage =====

Adatok tárolása egy munkamenetre.

<code javascript>
sessionStorage.valami = "adat";
</code>




// Adat mentése
<code javascript>
sessionStorage.setItem('key', 'value');
</code>

// Adat lekérése
<code javascript>
let data = sessionStorage.getItem('key');
</code>

// Törlés
<code javascript>
sessionStorage.removeItem("valami");
</code>


// Minden mentett adat törlése, ami így lett mentve: sessionStorage
<code javascript>
sessionStorage.clear();
</code>

===== document.cookie =====

<code javascript>
document.cookie = "valami=érték";
</code>

===== Linkek =====

  * https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage (2022)
  * https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage (2022)
  * https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie (2022)