• Szerző: Sallai András
• Copyright © 2011, Sallai András
• Licenc: CC Attribution-Share Alike 4.0 International
• Web: https://szit.hu

A süti angolul cookie. A böngészők és a szerverek HTTP protokollal kommunikálnak egymással. A HTTP egy állapotmentes protokoll. A weboldalakon, azonban sokszor szükség van a weblapok közötti állapot tárolására.

Általában statisztikákhoz, nyomon követéshez használjuk.

A szerver küld egy süteményt a böngésző számára, amiben adatok vannak. Ha a böngésző elfogadja a sütit, akkor egyszerű szöveges rekordként tárolja. A szerver később elkérheti a sütit a böngészőtől.

A sütik 5 változó hosszúságú mezőből állhatnak:

• Expires - Az adat mikor jár le. Ha üres, a süti lejár, ha látogató kilép a böngészőből.
• Domain - A webhelyed neve.
• Path - Az útvonal egy könyvtár vagy egy webhely, ahol be van állítva a süti. Ha üresen hagyjuk, a süti tartalma bárhonnan elérhető.
• Secure - Ha ez a mező tartalmazza a secure szót, akkor csak biztonságos szerverről tölthető le a süti. Ha mező üres, nincs ilyen korlátozás.
• Name=érték - Kulcs-érték pár.

Alapértelmezés szerint a sütik a böngésző bezárása után megmaradnak. Az élettartamuk szabályozható másodpercekben a max-age attribútummal.

30 nap beállítása:

document.cookie = "kulcs1=érték1; max-age=" + 30*24*60*60;

Az élettartam megadható az expires attribútummal is. Az attribútumot GMT/UTC formátumban kell megadni, és nem másodpercben.

document.cookie = "kulcs1=érték1; expires=Fri, 31 Dec 2100 23:59:59 GMT";

Linux alapú rendszeren a dátum konvertálása:

$ export LANG=en_US; date -R -d "2100-12-31 23:59:59"
Fri, 31 Dec 2100 23:59:59 +0100

A +0100-t át kell íri GMT-re:

Fri, 31 Dec 2100 23:59:59 GMT

A napok névvel:

• Mon
• Tue
• Wed
• Thu
• Fri
• Sat
• Sun

document.cookie = "adat1=valami";

document.cookie = "igaz=true; expires=Fri, 31 Dec 2021 12:00:00 GMT";

Az aktuális lapon legyen tárolva (path):

document.cookie ="valtozonev=tartalom; expires=Sat, 31 Dec 2011 12:00:00 UTC; path=/";

Az összes süti olvasása:

document.write(document.cookie);

document.write(document.cookie.split("=")[1]);

Több süti közül az adat1 kiválasztása:

const cookieValue = document.cookie
  .split('; ')
  .find(row => row.startsWith('adat1'))
  .split('=')[1];
 
 
console.log(cookieValue);

Függvényként:

function getCookie(name) {
    let result = document.cookie
    .split('; ')
    .find(row => row.startsWith(name))
    .split('=')[1];    
    return result;
}

Másik lehetőség:

function getCookie(cname) {
    let ca = document.cookie.split(';');
    let name = cname + "=";
    for(var item of ca) {
        while(item.charAt(0) == ' ') {
            item = item.substring(1);
        }
        if(item.indexOf(name) == 0) {
            return item.substring(name.length, item.length);
        }
    }
    return result;
}

Törlésnél a múltba állítjuk a lejárati időt.

document.cookie = "változónév=tartalom; expires=Sun, 31 Dec 2000 12:00:00 UTC; path=/";

vagy

document.cookie = "kulcs1=érték1; max-age=0"

sessionStorage.setItem('egy', 'első')
var res = sessionStorage.getItem('egy')

A munkamenetre példa a következő helyen, Craig Buckler által:

• http://blogs.sitepointstatic.com/examples/tech/js-session/session.js

Egy Demo hozzá:

• http://blogs.sitepointstatic.com/examples/tech/js-session/index.html