Lecture

Cookies

Cookies are small pieces of data stored by a website in the user's browser.

Cookies are used for various purposes, such as saving user preferences or recording pages visited by the user.


Key Features of Cookies

  • Expiration: Cookies can have an expiration date. Once this date is reached, the cookie is automatically deleted.

  • Domain and Path Restriction: Cookies can be restricted to be used only for specific domains and paths.

  • Security: Options like HttpOnly and Secure can prevent cookies from being stolen and exposing personal information. HttpOnly prevents JavaScript from accessing the cookie, while Secure ensures cookies are only sent over HTTPS (secure connections).


Setting a Cookie

JavaScript
document.cookie = 'username=John; expires=Fri, 31 Dec 2023 12:00:00 UTC; path=/'; // Set a cookie

This code

  • Sets a cookie named "username" with the value "John": username=John;

  • The cookie is valid until December 31, 2023: expires=Fri, 31 Dec 2023 12:00:00 UTC;

  • Accessible on all pages of the website: path=/.


Retrieving a Value from a Cookie

Cookies are stored in document.cookie, which returns a string representing the cookies.

JavaScript
function getCookie(name) { const value = '; ' + document.cookie; // Cookie values are separated by semicolons const parts = value.split('; ' + name + '='); // Find the cookie value using the cookie name if (parts.length == 2) return parts.pop().split(';').shift(); // Return the cookie value } console.log(getCookie('username')); // John

Deleting a Cookie

Cookies cannot be directly deleted by JavaScript. Instead, you can set the expiration date of the cookie to a past date, effectively expiring it.

JavaScript
document.cookie = 'username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;'; // Delete a cookie

By doing this, the "username" cookie is immediately deactivated.

The code on the right is an example of storing a cookie in the browser and checking the stored cookie.

Mission
0 / 1

Cookies can keep a record of the pages a user has visited.

True
False

Lecture

AI Tutor

Design

Upload

Notes

Favorites

Help

HTML
CSS
JavaScript
Loading...