Home
/
Blog
/
How to Read Cookies Using JavaScript

How to Read Cookies Using JavaScript

Q: How do I view cookies stored in my browser?

You can type document.cookie in the browser’s developer console to view cookies set for the current domain.

Vishal Sahu

Posted On: May 19, 2025

4 Min

Cookies play a key role in how websites remember your preferences and session data. Whether it’s storing login information, tracking user behavior, or personalizing your web experience, cookies do a lot behind the scenes.

Using JavaScript, developers can easily read cookies to access this data and enhance web functionality.

What Are Cookies and How to Create Them?

Cookies are small data snippets stored in your browser by websites. They’re commonly used to:

Remember your login sessions
Track browsing activity
Store preferences like dark mode or language settings

Each cookie is made up of a name-value pair and is accessible via JavaScript unless it’s marked as HttpOnly.

To create a cookie, you can use the document.cookie property.

Here’s a simple example:

document.cookie = "username=JohnDoe; expires=Fri, 31 Dec 2025 23:59:59 GMT; path=/";

1	document.cookie = "username=JohnDoe; expires=Fri, 31 Dec 2025 23:59:59 GMT; path=/";

This creates the cookie by setting the cookie name (username), value (JohnDoe), expiration date, and path.

How to Read a Cookie in JavaScript?

JavaScript makes it fairly simple to read cookies. Here’s how you can do it using the document.cookie property:

console.log(document.cookie);

1	console.log(document.cookie);

This returns a single string containing all the cookies for the current page, separated by semicolons:

"user=JohnDoe; theme=light; sessionToken=abc123”

1	"user=JohnDoe; theme=light; sessionToken=abc123”

Then, you extract a specific cookie value with the getCookieValue() function:

function getCookieValue(cookieName) {
  const cookies = document.cookie.split(';');
  for (let cookie of cookies) {
    let [name, value] = cookie.trim().split('=');
    if (name === cookieName) return value;
  }
  return null;
}

function getCookieValue(cookieName) {

const cookies = document.cookie.split(';');

for (let cookie of cookies) {

let [name, value] = cookie.trim().split('=');

if (name === cookieName) return value;

}

return null;

}

In this case, you are reading the cookie named theme:

let theme = getCookieValue('theme');
console.log(theme); // Outputs: light

1 2	let theme = getCookieValue('theme'); console.log(theme); // Outputs: light

So:

For Creating a Cookie: Use the document.cookie = “cookieData”.
For Reading a Cookie: Use document.cookie to get all cookies, and extract specific ones using functions like getCookieValue().

Best Practices When Reading Cookies

Below are some of the best practices that you must follow if you are reading cookies in JavaScript.

Use encodeURIComponent and decodeURIComponent: Always encode values before setting cookies and decode them when reading to handle special characters safely and avoid data corruption.
Avoid storing sensitive data in cookies: Never store sensitive information like passwords in cookies unless they are securely encrypted to protect against theft.
Update or delete cookies properly: Regularly update or delete cookies, especially session-related ones, to ensure secure and efficient session management.

Conclusion

Reading cookies with JavaScript is a simple yet powerful technique, especially when debugging or testing session data. Whether you’re building a login system, tracking user behavior, or validating browser storage, knowing how to read cookies is crucial for effective web development. This understanding ensures cookies are managed properly across different browsers and environments, maintaining a seamless user experience.

Frequently Asked Questions (FAQs)

How do I view cookies stored in my browser?

You can type document.cookie in the browser’s developer console to view cookies set for the current domain..

Can JavaScript read HTTPOnly cookies?

No, cookies marked as HttpOnly are inaccessible to JavaScript for security reasons.

How are cookies tested during browser automation?

Cookies are validated using browser automation frameworks like Selenium or WebDriverIO. You can also test cookie behavior manually on platforms like LambdaTest.

Do all browsers support cookies in the same way?

While most modern browsers support cookies consistently, cookie behavior can vary across browsers, especially with recent privacy updates. That’s why cross-browser testing is essential.

Vishal Sahu

Vishal Kumar Sahu is a Marketing Executive with over two years of experience in the software testing and QA domain. He holds a LambdaTest Certification in Automation Testing and has hands-on expertise in Selenium, Cypress, and Appium, with a focus on both web and mobile automation. Vishal has authored several technical blogs and specializes in writing about testing tools, best practices, and automation strategies. He blends technical knowledge with content strategy to support product education and engage the QA community through SEO-driven resources.

See author's profile

Author

Vishal Sahu

Blogs: 10