Recently while developing a site for a client that uses cookies, I run into an issue where I had large cookies stored in the browser and sent on every request, while it exceeded the size limit, Apache started throwing 400 (Bad Request) errors on screen.

It is not quite advised that your website stores huge cookies into the browser, even if it is under limit. Each request to your server is made, the cookies are also sent through the request headers and therefore more server resources will be used and it may slow down your site or the request itself.

To go about this 400 error, there are several options..

Storing cookies server-side and using tiny cookies to identify them

The idea is to save the cookies somewhere in your server:

  • In the database
  • In the cache system (Redis is very suitable for this as memory-caching solution)
  • Into temporary files (files that get flushed frequently, such as saving into /tmp/ directory)

After we save a potential cookie, we need to identify it for future so we give it a unique ID. And because we can’t identify a user (unless authenticated) while they’re browsing our site, to serve them their cookies stored server-side, we can also save the cookie IDs into a browser cookie (very small and tiny, nothing to worry about).

You can run a script globally at init that fetches the cookies identifiers from the user cookies, and then loads the cookies values from server-side, and then append these cookies into the $_COOKIE superglobal (so you can use $_COOKIE normally in other code).

Using localStorage (browser local storage API)

Almost every modern browser has support for this feature. Using┬álocalStorage you don’t need to worry about the size limitations nor the performance. Chrome for example uses SQLite database system for local storage, which is quite fast. The local storage API is quite simple, you can find a useful reference in the MDN.

One thing about localStorage is it happens on the client-side, so you can’t have access to data stored with it on the server. i.e PHP or Python or whatever server-side language you’re crafting with, won’t have access to these data, unless with some workarounds, like with AJAX.

Process cookies correctly

There are several mistakes we do while we store a cookie. One can have large amount of data saved into a cookie while only small bytes of raw text can be saved. Shorten the cookie values the most possible, and you saved yourself more cookies. Care to share?

Another important mistake we do, which also solved my case, is we save cookies globally across the domain. Most cookies we save are intended to be used only at specific route or web directory, not in the global root (which loads them across all subdirectories or routes) which makes it quite a mess and overloads the requests. Whatever language you’re using, it has native support for cookie processing and you should specify the static path of the cookie as the exact path where you want it to be loaded.

In general, browser cookies are meant to store small bytes of raw text that could be used to identify users, tracking, etc and not a client-side database.

Digital Ocean

Cheap Cloud SSD Hosting

Get a VPS now starting at $5/m, fast and perfect for WordPress and PHP applications

Sign Up with $10 Credit