Fix: Not Setting Cookie as Already Expired in Nuxt

What Causes This Warning?

This warning appears when you try to set a cookie with an expires or maxAge value that’s in the past. Nuxt prevents this because the cookie would be immediately deleted by the browser anyway.

The Problem

// ❌ Wrong - expiry date is in the past
const token = useCookie('token', {
  expires: new Date('2020-01-01')  // Past date!
})
token.value = 'my-token'

// ❌ Wrong - negative maxAge
const session = useCookie('session', {
  maxAge: -3600  // Negative seconds!
})

The Fix

Use future dates or positive durations:

// ✅ Correct - expires in 7 days
const token = useCookie('token', {
  expires: new Date(Date.now() + 7 * 24 * 60 * 60 * 1000)
})

// ✅ Correct - maxAge in seconds (1 hour)
const session = useCookie('session', {
  maxAge: 60 * 60  // 3600 seconds
})

// ✅ Correct - no expiry (session cookie)
const tempData = useCookie('temp')

Common Scenarios

// Expire in 1 hour
const oneHour = useCookie('data', {
  maxAge: 60 * 60
})

// Expire in 24 hours
const oneDay = useCookie('data', {
  maxAge: 60 * 60 * 24
})

// Expire in 7 days
const oneWeek = useCookie('data', {
  maxAge: 60 * 60 * 24 * 7
})

// Expire in 30 days
const oneMonth = useCookie('data', {
  maxAge: 60 * 60 * 24 * 30
})

// Expire in 1 year
const oneYear = useCookie('data', {
  maxAge: 60 * 60 * 24 * 365
})

Using Date Object

// Expire at specific future date
const deadline = new Date('2025-12-31')
const promo = useCookie('promo', {
  expires: deadline
})

// Expire in 2 hours from now
const twoHoursFromNow = new Date(Date.now() + 2 * 60 * 60 * 1000)
const temp = useCookie('temp', {
  expires: twoHoursFromNow
})

Deleting Cookies

To delete a cookie, set its value to null:

// ✅ Correct way to delete
const cookie = useCookie('token')
cookie.value = null  // Cookie is deleted

// ❌ Wrong - don't use past dates to delete
const cookie = useCookie('token', {
  expires: new Date(0)  // Will trigger warning
})

Dynamic Expiration

// Based on user preference
function setRememberMe(remember: boolean) {
  const auth = useCookie('auth', {
    maxAge: remember
      ? 60 * 60 * 24 * 30  // 30 days if remember
      : undefined          // Session cookie if not
  })
  auth.value = 'token'
}

// In API route or server middleware
export default defineEventHandler((event) => {
  // ✅ Correct
  setCookie(event, 'session', 'value', {
    maxAge: 60 * 60 * 24  // 24 hours
  })

  // ❌ Wrong - past expiry
  setCookie(event, 'session', 'value', {
    expires: new Date('2020-01-01')
  })
})

// Check current cookie value and expiry
const myCookie = useCookie('myCookie')

console.log('Value:', myCookie.value)

// To check expiry, you'd need to look at browser DevTools
// Application > Cookies > your domain

const cookie = useCookie('name', {
  // How long until expiry
  maxAge: 3600,           // Seconds from now
  expires: new Date(),    // Specific date (must be future)

  // Security options
  secure: true,           // HTTPS only
  httpOnly: false,        // Not accessible by useCookie if true
  sameSite: 'lax',        // 'strict' | 'lax' | 'none'

  // Scope
  path: '/',              // URL path
  domain: '.example.com', // Domain scope
})

Session Cookies

If you want a cookie that expires when the browser closes:

// Session cookie - no maxAge or expires
const sessionCookie = useCookie('session')
sessionCookie.value = 'data'

Quick Reference

Duration	maxAge Value
1 minute	`60`
1 hour	`3600`
1 day	`86400`
1 week	`604800`
1 month	`2592000`
1 year	`31536000`

Quick Checklist

expires date is in the future
maxAge is a positive number
To delete cookies, set value to null
Session cookies have no expiry set
Date calculations use Date.now() for current time