How to Delete Cookies in Next.js

How to Remove Cookies in Next.js?

Recently I had a requirement to remove all cookies from the Next.js app’s domain.

The Next.js page was using getServerSideProps. Here is how the code looked

const deleteCookies = (cookies:any, res:any) => {
  try{
    let cookiesArr = [];
    // ## iterating over the list of cookie
    // ## and setting max-age to 0
    for(const cookie in cookies){
      cookiesArr.push(`${cookie}=;Path=/;MAX-AGE=0`);
    }
    // ## reset the modified cookie list to res 
    res.setHeader('set-cookie',cookiesArr);
  } catch(error){
    console.log('error occured ', error)
  }
  return res;
}

export async function getServerSideProps({req,res}:any) {
  res = deleteCookies(req.cookies, res);
  return {
    props: {}, // will be passed to the page component as props
  }
}

The above code is self explanatory where inside the getServerSideProps I’m calling the deleteCookies method to delete all the cookie.