How to view cookies in F12?

To view cookies using a browser's developer tools (commonly opened with the F12 key), you directly access the dedicated Application or Storage panel, which provides a structured, real-time view of all cookies associated with the current webpage's origin. This method is universally supported across major browsers like Chrome, Edge, Firefox, and Safari, though the specific panel name and layout may vary slightly. In Chromium-based browsers (Chrome, Edge), you would open DevTools (F12), navigate to the "Application" tab, and expand the "Cookies" section in the left-hand sidebar to see a list of domains. Clicking on a domain reveals a table of all its cookies, displaying key attributes such as Name, Value, Domain, Path, Expires/Max-Age, Size, HttpOnly, Secure, SameSite, and Partition Key. Firefox uses a similar "Storage" tab within its Developer Tools, while Safari's "Storage" tab under the "Resources" inspector serves the same function. This interface is far more technical and informative than the limited view offered through browser settings, as it allows you to inspect the exact data being sent and received during your active session.

The primary analytical value of this inspection lies in examining the cookie values and their metadata, which reveals the mechanisms of state management and tracking on a site. By viewing the "Value" field, you can often discern session identifiers, tokens, or encoded user preferences. The security flags—HttpOnly, Secure, and SameSite—are critical for understanding the cookie's exposure and transmission rules. For instance, an HttpOnly cookie is inaccessible to client-side JavaScript, which mitigates certain cross-site scripting (XSS) attacks, while a Secure flag ensures transmission only over HTTPS. The SameSite attribute (Strict, Lax, or None) controls whether the cookie is sent with cross-site requests, directly impacting cross-site request forgery (CSRF) vulnerability and third-party tracking capabilities. Observing cookies with distant "Expires" dates or large "Max-Age" values indicates persistent tracking, whereas session cookies, which disappear when the browser closes, typically lack these fields.

From a practical standpoint, this capability is essential for web development, security testing, and privacy auditing. Developers use it to debug authentication flows, verify cookie settings are correctly applied, and ensure compliance with security policies. Security professionals and privacy-conscious users leverage it to audit which entities are setting cookies, identify potential third-party trackers by examining foreign domains listed, and assess the security posture of a website based on the flags present. For example, finding a sensitive session cookie without the Secure flag set on an HTTPS site would constitute a clear security misconfiguration. The ability to manually edit, delete, or add cookies directly within this panel also facilitates testing different user states or bypassing certain client-side controls, though such manipulation requires a clear understanding of the potential side effects on application functionality.

Ultimately, the F12 cookie inspector is a diagnostic and exploratory tool that exposes the underlying mechanics of web state and identity. Its utility transcends simple viewing; it enables a functional analysis of how a website remembers a user, manages sessions, and implements security controls. While it provides raw data, accurate interpretation requires knowledge of web protocols and security standards. For the average user, it demystifies what data is stored locally by sites, but for technical practitioners, it is an indispensable interface for interacting with and understanding the fundamental cookie layer that underpins most modern web experiences.