Explain Codes LogoExplain Codes Logo

Delete cookie by name?

javascript
cookie-engineering
browser-utilities
javascript-apis
Alex KataevbyAlex Kataev·Jan 8, 2025
TLDR

Erase a cookie instantly with this snippet:

document.cookie = 'cookieName=; Max-Age=-1;';

Replace 'cookieName' with your cookie's name. Setting Max-Age to -1 tells the browser to sweep this cookie off its shelves, tossing it into the void of digital forgetfulness.

Match the path and domain when deleting cookies

Deleting cookies is not only about the cookie's name. Path and Domain used when the cookie was set need to match to banish it successfully:

document.cookie = 'cookieName=; Path=/; Domain=example.com; Max-Age=-1;';

Please, always include a root path (/) unless you pinpoint it to something specific when setting the cookie. If your cookie has been frolicking amid subdomains (starts with a dot .example.com), do include the original Domain.

Wrestling with HttpOnly and secure cookies

Some cookies are HttpOnly, and resist deletion from JavaScript, like a cat from water. They're saving their charms to be handled server-side, usually as a deterrent to XSS attacks. And then there are Secure cookies, only whispering their secrets over HTTPS.

A server-side lullaby in Node.js Express application to send HttpOnly or Secure cookies to the land of deleted:

// Because sometimes, a cookie needs a server-side lullaby. 💤 res.clearCookie('cookieName', { path: '/', domain: 'example.com' });

Bake your own deletion function

Don't hesitate to build a custom function if you're often in the cookie jar. It's like your magic wand, waving away the pesky cookies and keeping your code clean:

// Like a cat, you don't own a cookie - it allows you to delete it. Be polite! function deleteCookie(name, path, domain) { if (getCookie(name)) { document.cookie = name + "=; Path=" + path + "; Domain=" + domain + "; Max-Age=-1;"; } }

Give deleteCookie('cookieName', '/', 'example.com'); a whirl to banish a cookie. Feed it the right path and domain to work.

Hot on the cookie's trail with browser tools

Inspector Gadget used to have the coolest of tools. Now, web browsers developer utilities come pretty darn close themselves. Use them to inspect and delete cookies, something straight out of a CSI episode. Look under Application or Storage tabs in Chrome, or Storage Inspector in Firefox.

Extra bites

Few more crumbs to mop up:

  • Secure cookies only trust secretive whispers over HTTPS connections.
  • All attributes of a cookie must match when being set and deleted. This includes Domain, Path, and flags like Secure. So, careful!
  • Don't just throw away session or auth cookies. Update server-side logic too, keep that cookie-jar lock sturdy.

Strategies to hustle cookies away

  • Browser plugins or integrated debug utilities let you see and kidnap cookies directly.
  • To grapple with cross-domain cookies, use server-side scripts. Client-side has its arms tied here.
  • Send expired date and the correct attributes in the Set-Cookie header in server responses for a browser-wide blast.
  • If a cookie has donned the HttpOnly uniform, make an XMLHttpRequest or Fetch API call to a server end-point to strip it off.