En este post te mostraré cómo hacer que la sesión persista al usar la fetch API de JavaScript. Pasa que en ocasiones hacemos cosas con la sesión del lado del servidor, pero al usar fetch no se toma en cuenta la sesión.

Por ejemplo, iniciamos sesión con fetch y al querer acceder a un recurso protegido con la sesión, nos dice que no hay datos de sesión o que no estamos logueados.

Te mostraré cómo hacer que la sesión del lado del servidor (lo he probado con PHP, Go y Node.js o bueno JavaScript del lado del cliente) persista al usar fetch.

Explicación del problema

Lo que pasa es que fetch no está enviando las cookies ni otras cosas, al menos que le digamos. Para ello debemos configurar la petición para que incluya las credenciales.

Configurando fetch

Lo que tenemos que hacer es, dentro de los ajustes de fetch, incluir credentials en true. Esto se puede hacer proporcionando el segundo argumento que indica las configuraciones. Ahí se especifica el método, cuerpo, etcétera pero además credentials:

fetch("https://sitio.com", {
  // ...
  credentials: "include", // <-- Justo aquí
  // ...
});

Y eso es todo, ahora se enviarán las cookies que hacen que la sesión persista. Recuerda que puedes usar distintos métodos, rutas, etcétera. Todo eso está en mi post sobre fetch.

Si usas CORS

En caso de que estés usando CORS, debes configurar el encabezado Access-Control-Allow-Credentials en true. Dependerá de tu servidor, pero en mi blog tengo un ejemplo con PHP y con Node.

Si el post ha sido de tu agrado te invito a que me sigas para saber cuando haya escrito un nuevo post, haya actualizado algún sistema o publicado un nuevo software. Facebook | X | Instagram | Telegram | También estoy a tus órdenes para cualquier contratación en mi página de contacto