You must have heard the term `Cookies` a trillion times, before coming to my blog - A weird, but still somewhat magical place.

A place, where my experience from previous weeks of work, days of cursing and hours of crying come melt down into a few-hundreds words.Words, that hopefully save you days in figuring out, what I had to learn.

Well... I hope you enjoy this one!

Why?

Alex, please tell me why?

I have recently tried to implement a javascript activity tracker onto a mobile App. There were several issues concerning cookies, so I read more about them and would love to summarize a few things about them for you.

What are cookies for?

Cookies are most often used to track users' consent, activity or the user's identity itself.

That means: If you were to steal my authentication cookie, you could pretend as if you were me. Luckily, they have expiry dates, so if you were to find an old cookie under my couch, this won't have that much of an impact.

Where do they come from? How are they set?

Perfect question! They can either:

• be set from the server, via the Set-Cookie Header, that might be sent back to the client from the server.

• be set by the client manually.

Are they secure?

Yes! Browsers have been working on securing paths to exploit your browser since the introduction of Cookies.

Security mechanisms

Did you ever wonder why you can not manipulate an iframe's javascript code? Or why does something like CORS exist? Guess what! It's all about the cookies.

• Cookies are bound to the actual host that holds the cookies. I could not set up a script website, that steals your cookies.

• CSRF Tokens guarantee, the request came from the website itself and not from any other window.

A few scenarios, that do not work

Scenario 1: Get Cookies From the Currents User Google.com

Given: An user, that is authenticated on google.com, then I want to run a script, that fetches the cookies for google.com.

Oh dear, this won't work and thank god it doesn't. This would make

Scenario 2: Get Cookies From an IFrame

Given: An user, that is authenticated on example.com, then I want to fetch the cookies from within the iframe

This won't work either, even if you have the best intentions. Cookies are host-bound!

Accessing cookies in the frontend

You can manipulate the cookies for YOUR CURRENT HOST by accessing the document.cookie field.

// Set the cookie
document.cookie = 'user_cookie=83981923819023812039; tracker_cookie=3893298'

// and fetch via
document.cookie // user_cookie=83981923819023812039; tracker_cookie=389329

What about local storage?

Local Storage and Cookie storage differ a lot. Cookies are sent to the server, in a lot of requests and therefore meant to be read by it (eg. for authentication). While localStorage will never make it out of its cage.

Conclusion

Cookies and their corresponding security mechanisms might seem odd and weird at first, but they have a strong reason to exist.

If you found this article helpful, share it with a friend! ❤️