estoy trabajando con el siguiente js y tratando de obtener un valor de cookie y este es mi código:

 import cookie from "js-cookie"; export default function Home({ token }) { return ( <div className="flex flex-col items-center bg-reddit-dark py-2 text-white"> {/* setting cookie */} <button onClick={() => { cookie.set("token", "ABCD"); }} > login </button> {/* removing cookie */} <button onClick={() => { cookie.remove("token"); }} > logout </button> <h1>token: {token}</h1> </div> ); } export const getServerSideProps = async ({ req, res }) => { const res = await fetch(`http://localhost:5000/api/posts/`); const posts = await res.json(); return { props: { token: req.cookies.token, posts, }, }; };

entonces puedo obtener y eliminar una cookie bien, pero cuando trato de obtener el valor de la cookie usando la función getServerSideProps() , devuelve indefinido y he borrado las cookies de mi navegador pero aún no funcionó. He mirado innumerables soluciones y copiado pero tampoco funcionó.

Actualice que estaba llamando a este componente en _app.js y ahora lo estoy llamando en cada página individual, así que ¿hay algo más que pueda hacer para esto?