You know that feeling when everything works perfectly in development, but production decides to play games?

I spent yesterday chasing down a ghost. Our authentication flow was flawless locally—users could log in and out without a hitch. But the moment we deployed to production, logout mysteriously stopped working. Cookies refused to clear. Users were stuck in an endless login loop.

After hours of staring at logs and questioning my life choices, the culprit turned out to be something deceptively simple:

cookieStore.delete() wasn't enough.

In development, with secure: false, cookies are forgiving. They'll let you delete them without matching every attribute. But in production, with secure: true and sameSite: "lax", the browser demands perfection. If your delete operation doesn't specify the exact same cookie attributes, it simply... ignores you.

The fix was surprisingly elegant:

// What didn't work:
cookieStore.delete(COOKIE_NAME)

// What worked:
cookieStore.set(COOKIE_NAME, '', {
  ...COOKIE_OPTIONS,
  maxAge: 0  // Expire immediately
})

Enter fullscreen mode Exit fullscreen mode

Setting an empty cookie with maxAge: 0 and the exact same attributes as the original forces the browser to respect the expiration. No ambiguity, no edge cases.

Key takeaways:

🍪 Production cookies are strict. Match attributes exactly when clearing.
🔍 delete() isn't always reliable in Next.js—set() with maxAge: 0 is your friend.
💡 The subtle differences between dev and prod environments will humble you every time.

Shoutout to everyone who's debugged authentication issues past midnight. You're not alone. ❤️

NextJS #WebDevelopment #Authentication #Debugging #JavaScript #ProdIssues #DevLife