Zrobiłem do testów plik HTML, w którym testuję ciastka i magazyn lokalny.
Plik testuję z dysku lokalnego. Magazyn działa poprawnie, ale w przypadku ciastek, jak się naciśnie F5, to dane są utrzymane, ale jak się zamknie i otworzy przeglądarkę, to ciastka giną, a zostaje sam magazyn. Przy uruchamianiu wyświetla alert z informacją, co zostało zachowane. Myślę, że obsługa testu jest intuicyjna. Przyciski ustawiające i usuwające działają na obu obszarach jednocześnie
Dlaczego ciastka nie są zachowywane pomimo późniejszej daty wygaśnięcia?
<!doctype html>
<html>
<head>
</head>
<body>
<script>
function CookieExists(name)
{
if (document.cookie !== "")
{
const cookies = document.cookie.split(/; */);
for (let i=0; i<cookies.length; i++)
{
const cookieName = cookies[i].split("=")[0];
const cookieVal = cookies[i].split("=")[1];
if (cookieName === decodeURIComponent(name))
{
return true;
}
}
}
return false;
}
function CookieGet(name)
{
if (document.cookie !== "")
{
const cookies = document.cookie.split(/; */);
for (let i=0; i<cookies.length; i++)
{
const cookieName = cookies[i].split("=")[0];
const cookieVal = cookies[i].split("=")[1];
if (cookieName === decodeURIComponent(name))
{
return decodeURIComponent(cookieVal);
}
}
}
}
function CookieSet(name, val)
{
const cookieName = encodeURIComponent(name);
const cookieVal = encodeURIComponent(val);
let cookieText = cookieName + "=" + cookieVal;
if (typeof days === "number")
{
const data = new Date(2030, 1, 1, 0, 0, 0, 0);
cookieText += "; expires=" + data.toGMTString();
}
//cookieText += "; path=/";
//cookieText += "; secure";
document.cookie = cookieText;
}
function CookieDelete(name)
{
const cookieName = encodeURIComponent(name);
document.cookie = cookieName + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}
function CookieRaw()
{
return document.cookie;
}
function StorageExists(name)
{
if (localStorage[name])
{
return true;
}
else
{
return false;
}
}
function StorageGet(name)
{
return(localStorage.getItem(name));
}
function StorageSet(name, val)
{
localStorage.setItem(name, val);
}
function StorageDelete(name)
{
localStorage.removeItem(name)
}
function StorageRaw()
{
var zawartosc = "";
for(var klucz in localStorage)
{
zawartosc += ( klucz + "=" + localStorage.getItem( klucz ) + "\n" );
}
return zawartosc;
}
var StartInfo = "";
if (CookieExists("Test"))
{
StartInfo += "Ciastko Test: " + CookieGet("Test") + "\n";
}
else
{
StartInfo += "Brak ciastka Test\n";
}
if (CookieExists("Nazwa"))
{
StartInfo += "Ciastko Nazwa: " + CookieGet("Nazwa") + "\n";
}
else
{
StartInfo += "Brak ciastka Nazwa\n";
}
if (StorageExists("Test"))
{
StartInfo += "Magazyn Test: " + StorageGet("Test") + "\n";
}
else
{
StartInfo += "Brak magazynu Test\n";
}
if (StorageExists("Nazwa"))
{
StartInfo += "Magazyn Nazwa: " + StorageGet("Nazwa") + "\n";
}
else
{
StartInfo += "Brak magazynu Nazwa\n";
}
alert(StartInfo);
</script>
<button onclick="CookieSet('Test', 'ABC'); StorageSet('Test', 'ABC');">Ustaw Test=ABC</button>
<button onclick="CookieSet('Test', '123'); StorageSet('Test', '123');">Ustaw Test=123</button>
<button onclick="CookieDelete('Test'); StorageDelete('Test');">Usuń Test</button>
<br>
<button onclick="CookieSet('Nazwa', 'ABC'); StorageSet('Nazwa', 'ABC');">Ustaw Nazwa=ABC</button>
<button onclick="CookieSet('Nazwa', '123'); StorageSet('Nazwa', '123');">Ustaw Nazwa=123</button>
<button onclick="CookieDelete('Nazwa'); StorageDelete('Nazwa');">Usuń Nazwa</button>
<br>
<button onclick="alert(CookieRaw());">Dane surowe ciastek</button>
<button onclick="alert(StorageRaw());">Dane surowe magazynu</button>
<br>
<a href="http://kursjs.pl/kurs/cookies/cookie.php">http://kursjs.pl/kurs/cookies/cookie.php</a>
<br>
<a href="https://magazynt3.pl/czym-jest-localstorage-i-jak-je-wykorzystac-z-html5/">https://magazynt3.pl/czym-jest-localstorage-i-jak-je-wykorzystac-z-html5/</a>
<br>
<a href="https://stackoverflow.com/questions/3262605/how-to-check-whether-a-storage-item-is-set">https://stackoverflow.com/questions/3262605/how-to-check-whether-a-storage-item-is-set</a>
</body>
</html>