Siirry pääsisältöön

Web Storage 23.06

Avaa ChatGPT:ssä

Web storage on keskeinen käsite verkkokehityksessä, joka mahdollistaa verkkosivustojen tallentaa tietoa asiakaspuolella. Tämä mahdollistaa verkkosovelluksille tilan, mieltymysten ja muiden tietojen tallentamisen paikallisesti käyttäjän selaimessa. Web storage tarjoaa tavan säilyttää tietoja sivun uudelleenlatauksien ja selaimen istuntojen yli, mikä vähentää toistuvien palvelinpyyntöjen tarvetta ja mahdollistaa offline-ominaisuudet.

webforJ tukee kolmea mekanismia asiakastietojen tallentamiseksi: Evästeet, Istuntotallennus ja Paikallinen tallennus.

Web Storage kehittäjätyökaluissa

Voit nähdä nykyiset evästeet, paikallisen tallennuksen ja istuntotallennuksen avain-arvo-parit selaimen kehittäjätyökaluissa.

Yhteenveto eroista

OminaisuusEvästeetIstuntotallennusPaikallinen tallennus
KestävyysMääritettävä vanhentumisaikaSivun istunnon kestoKestävä kunnes erikseen poistettu
Tallennuskoko4 KB per evästeNoin 5-10 MBNoin 5-10 MB
KäyttötapauksetKäyttäjäautentikointi, mieltymykset, seurantaTilapäiset tiedot, lomaketiedotKestävät asetukset, käyttäjän mieltymykset
TurvallisuusAlttiita XSS:lle, voidaan suojata lipuillaTyhjentyy istunnon päättyessä, vähemmän riskiäSaatavilla JavaScriptin kautta, mahdollinen riski

Web storage käyttö

CookieStorage, SessionStorage ja LocalStorage -luokat webforJ:ssä laajentavat kaikki abstraktia WebStorage -luokkaa. Saadaksesi sopivan objektin, käytä staattisia metodeja CookieStorage.getCurrent(), SessionStorage.getCurrent(), tai LocalStorage.getCurrent(). Lisätäksesi, saadaksesi ja poistaaksesi avain-arvo-pareja, käytä metodeja add(key, value), get(key), ja remove(key).

Evästeet

Evästeet ovat pieniä tietokappaleita, jotka tallennetaan asiakaspuolelle ja lähetetään palvelimelle jokaisen HTTP-pyynnön mukana. Niitä käytetään usein käyttäjäistuntojen, mieltymysten ja autentikointitietojen muistamiseen. Lisäksi evästeillä voi olla attribuutteja. Aseta attribuutit evästeille käyttämällä add(key, value, attributes).

Avainominaisuudet:

  • Voidaan tallentaa tietoa eri verkkotunnuksille
  • Tukee vanhentumispäiviä
  • Pieni tallennuskoko, tyypillisesti rajoitettu 4 KB:hen
  • Lähetetään jokaisen HTTP-pyynnön yhteydessä
  • Voidaan lisätä attribuutteja
Evästeiden vanhentuminen

Oletusarvoisesti evästeet webforJ:ssä vanhenevat 30 päivän kuluttua. Voit muuttaa tätä max-age tai expires -attribuuttien avulla.

Evästeiden käyttö

Seuraava koodinpätkä demonstroi CookieStorage -objektin käyttöä.

// Pääsy eväste tallennukseen
CookieStorage cookieStorage = CookieStorage.getCurrent();

// Lisää uusi eväste tai päivitä olemassa oleva eväste
cookieStorage.add("username", "JohnDoe", "Max-Age=3600; Secure; HttpOnly");

// Pääsy evästeeseen annetuilla avaimilla
String username = cookieStorage.get("username");

// Poista eväste annetuilla avaimilla
cookieStorage.remove("username");
Evästeiden turvallisuus

Tietyt evästeattribuutit, kuten Secure ja SameSite=None, edellyttävät suojattua yhteyttä HTTPS:n avulla. Nämä attribuutit varmistavat, että evästeitä lähetetään vain suojatuilla yhteyksillä, suojaten niitä sieppauksilta. Lisätietoa, katso MDN dokumentaatio evästeiden turvallisuudesta.

Käyttötapaukset

Seuraavat käyttötapaukset soveltuvat hyvin evästeiden käyttöön:

  • Käyttäjäautentikointi: Tallenna istuntotokenit, jotta käyttäjät pysyvät kirjautuneina.
  • Mieltymykset: Tallenna käyttäjän mieltymyksiä, kuten teema-asetuksia tai kieltä.
  • Seuranta: Kerää tietoa käyttäjän käyttäytymisestä analytiikkaa varten.

Istuntotallennus

Istuntotallennus tallentaa tietoja sivun istunnon ajan. Tiedot ovat käytettävissä vain saman istunnon sisällä ja tyhjennetään, kun sivu tai välilehti suljetaan. Tiedot kuitenkin säilyvät uudelleenlatausten ja palautusten aikana. Istuntotallennus on paras vaihtoehto tilapäisten tietojen tallentamiseen yhden sivun istunnon aikana ja tilan ylläpitämiseen eri sivujen välillä samassa istunnossa.

Avainominaisuudet

  • Tietoja ei lähetetä jokaisen HTTP-pyynnön mukana
  • Suurempi tallennuskoko kuin evästeillä
  • Tiedot tyhjennetään, kun sivu tai välilehti suljetaan
  • Tietoja ei jaeta välilehtien välillä

Istuntotallennuksen käyttö webforJ:ssä

Seuraava koodinpätkä demonstroi SessionStorage -objektin käyttöä.

// Pääsy istuntotallennukseen
SessionStorage sessionStorage = SessionStorage.getCurrent();

// Lisää uusi tai päivitä olemassa oleva istuntotallennuspari
sessionStorage.add("currentPage", "3");

// Pääsy istuntotallennuspariin annetuilla avaimilla
String currentPage = sessionStorage.get("currentPage");

// Poista istuntotallennuspari annetuilla avaimilla
sessionStorage.remove("currentPage");

Käyttötapaukset

Seuraavat käyttötapaukset soveltuvat hyvin istuntotallennuksen käyttöön:

  • Tilapäinen datan tallennus: Tallenna tiedot, jotka tarvitsevat vain säilyä, kun käyttäjä on tietyllä sivulla tai istunnossa.
  • Lomaketiedot: Tallenna tilapäisiä lomaketietoja käytettäväksi istunnon aikana.

Paikallinen tallennus

Paikallinen tallennus tallentaa tietoja ilman vanhentumispäivää. Tiedot säilyvät jopa selaimen sulkemisen jälkeen, ja niihin voidaan päästä, milloin tahansa käyttäjä vierailee verkkosivustolla jälleen. Paikallinen tallennus on paras vaihtoehto käyttäjän mieltymysten tai asetusten tallentamiseen, tietojen välimuistiin tallentamiseen suorituskyvyn parantamiseksi ja sovellustilan tallentamiseen istuntojen välillä.

Avainominaisuudet

  • Tiedot säilyvät istuntojen yli
  • Tietoja ei lähetetä jokaisen HTTP-pyynnön mukana.
  • Suurempi tallennuskoko kuin evästeillä
  • Ei sovellu arkaluontoisille tiedoille
  • Sinun on hallittava tiedot itse, koska selain ei koskaan poista niitä automaattisesti

Paikallisen tallennuksen käyttö webforJ:ssä

Seuraava koodinpätkä demonstroi LocalStorage -objektin käyttöä.

// Pääsy paikalliseen tallennukseen
LocalStorage localStorage = LocalStorage.getCurrent();

// Lisää uusi tai päivitä olemassa oleva paikallinen tallennuspari
localStorage.add("theme", "dark");

// Pääsy paikalliseen tallennuspariin annetuilla avaimilla
String theme = localStorage.get("theme");

// Poista paikallinen tallennuspari annetuilla avaimilla
localStorage.remove("theme");

Käyttötapaukset

Seuraavat käyttötapaukset soveltuvat hyvin paikallisen tallennuksen käyttöön:

  • Kestävät tiedot: Tallenna tiedot, jotka tulisi olla saatavilla useiden istuntojen yli.
  • Mieltymykset: Tallenna käyttäjän asetukset ja mieltymykset, jotka säilyvät ajan myötä.