Svenska
  • cookie
  • nextjs
  • serverless

Hur man åtgärdar felmeddelandet 'cookie size exceeded' genom att dela upp cookies

En lösning för att åtgärda felmeddelandet 'cookie size exceeded': dela upp cookien i flera mindre cookies och rekonstruera dem på serversidan. Denna lösning fungerar särskilt bra för serverlösa plattformar utan att kräva ytterligare infrastruktur.

Sijie
Sijie
Developer

TL;DR: När din cookie-storlek överskrider 4KB-gränsen i webbläsaren, dela upp den i flera mindre cookies och rekonstruera dem på serversidan. Denna lösning fungerar särskilt bra för serverlösa plattformar utan att kräva ytterligare infrastruktur.

Cookieanvändning i Logto SDK:er

I de flesta Logto SDK:er för traditionella webbappar lagrar vi sessionsdata i HTTP-only-cookies för säkerhet. Här är vårt tillvägagångssätt:

När SDK utför åtgärder som kräver sessionsdata:

  • Krypterar den med symmetrisk kryptering
  • Lagrar den krypterade strängen i en HTTP-only-cookie
  • Ställer in säkerhetsflaggor för att säkerställa endast HTTPS-överföring

Detta tillvägagångssätt kräver ingen extern lagring och kan distribueras direkt till populära serverlösa plattformar som Vercel utan några ytterligare infrastrukturförändringar.

Men när vi implementerade multi-organisationsstöd stötte vi på en begränsning. Vår cookie-storlek växte bortom 4KB-gränsen i webbläsaren eftersom vi behövde lagra:

  • Inloggnings- och annan sessionsdata
  • ID-tokens för användarautentisering
  • Uppdateringstokens
  • Åtkomsttokens med olika resursindikatorer
  • Organisationstokens som är i JWT med payload, en per organisation, vilket kan bli ganska stort om flera organisationer är aktiva samtidigt

Detta resulterade i felet:

Webbläsare upprätthåller strikta cookiestorleksbegränsningar, med de flesta som begränsar individuella cookies till 4KB och total cookiestorlek till 8KB per domän.

Hur är det med att använda extern lagring?

Att använda extern lagring som Redis eller en databas skulle kräva ytterligare infrastrukturinställningar, vilket ökar både kostnaderna och komplexiteten för SDK-användare. Detta går emot vårt mål att tillhandahålla en utvecklarvänlig lösning.

Även om minneslagring skulle kunna vara ett alternativ, fungerar det inte bra för serverlösa miljöer där instanser är kortvariga och minnet inte delas mellan förfrågningar.

Lösningen: Dela upp cookies

En enkel lösning är att dela stora cookies i mindre delar. Denna artikel visar tillvägagångssättet med Next.js som exempel:

1. Dela sessionsdata

2. Lagra delarna

3. Rekonstruera vid förfrågan

Bästa praxis för implementering

1. Hantering av delstorlek

2. Hantering av ren session

Övervaka total cookiestorlek:

Slutsats

Att dela upp cookies erbjuder en elegant lösning som är både lätt att implementera och minimalt störande för befintlig applikeringsarkitektur. Genom att helt enkelt bryta ner stora cookies i mindre delar kan utvecklare övervinna webbläsarens storleksbegränsningar utan att ändra sin kärnsessionhantering eller lägga till externa beroenden.