Cookie Fallback and Size Limits

[ercultimate]

I ran into an issue with the cookie fallback. My application was writing back a large JSON object which wasn't saved due to the cookie size limitation of 4kb each.

Is this a case angular-local-storage should be handling?

[grevory]

This is a good question. Are cookie limits browser-specific? How can we break about objects to handle this limitation?

Remember that local storage has major size limitations as well so it's really not meant to handle large data.

[ercultimate]

How to break it up is arguably the easiest part. Once the object is string-ified and ready to be assigned as a cookie value, then it should be simple to check the size and substring it. You then write it out to multiple cookies sort of like a multi-part RAR, I guess?

As for limitations, this is where it gets really messy. Basically, the limits are all arbitrary and browser-specific. The specs only recommend a minimum.

https://tools.ietf.org/html/rfc6265#page-27

o At least 4096 bytes per cookie (as measured by the sum of the
length of the cookie's name, value, and attributes).
o At least 50 cookies per domain.
o At least 3000 cookies total.

Modern browsers seem to take the per-cookie minimum limit as the maximum allowed (personally tested on iOS 9.2 Safari and Ubuntu Chrome 48). They also seem to honor the second recommendation (Chrome at 180 per domain).

The more I look into this problem, the more unnecessarily complex it gets. Even checking to see if a cookie was successfully set runs into (far-edge) cases where you can only guess the result of a set().

I'm starting to wonder if it's actually worth the bloat of handling all these items. Perhaps simply a warning event should be broadcasted when setting a cookie over 4kb?

[grevory]

That's certainly an easy task. Will you create a PR?

[ercultimate]

Yea, sure.

[mcbejn]

this issue is still present on mobile safari, so for anything larger than 4kb it's unusable, just wanted to let everyone know

[suavelizard]

Reccomendation from SO

1. Serialize your object
2. Append a hash to prevent tampering (e.g. md5sum(serialized + secret))
3. Compress the string with gzip
4. Encode the result with base64

Gzip might be overkill for JS

[shawno]

Hi @grevory. Small world!

This is still an issue in Safari 10.

We're using this to store shopping carts for users browsing privately and are running into the exact same issue as @ercultimate: "My application was writing back a large JSON object which wasn't saved due to the cookie size limitation of 4kb each."

Splitting the cookie into 4k chunks and storing up to 50 of those seems like a great solution. For context, it takes the maximum number of items in our cart from ~5 (not viable) to ~250 (very future-proof).

Great module, thanks for the solid work.