Как достать куки из ответа на запрос?

Пытаюсь решить проблему которую сам себе и создал в целях обучения.

Я хочу аутентифицироваться(залогиниться) с фронта отправив POST запрос в body {login, password}. В ответ я получаю в Cookie какое-то value (в примере ниже это userId), на фронте хочу взять из Cookie это значение сохранить его в localStorage, чтобы бы при обновлении страницы оставаться залогиненным - если есть кука в localStorage отправлять запрос на сервер проверяя не устарела ли она и отправлять последующие запросы в ручную добавляя в header эту куку

Но я никак не могу Cookie вручную, хотя в devTools они видны и даже в ответе сервера в headers есть Set-Cookie (через document.cookie, тоже не получается). Что я делаю не так или возможно логика с сохранением в localStorage неправильная?

Функция для запросов

export async function fetchAPI(url = '', data, method = 'POST') {
    const options = {
        method: method,
        headers: {
            'Content-Type': 'application/json',
        },
        credentials: 'include',
    }

    if(data) {
        options['body'] = JSON.stringify(data)
    }

    const response = await fetch(url, options);
    return response;
}

Запрос на аутентификацию

async (data) => {
    try {
        const response = await fetch('http://localhost:3000/login', data, 'POST');

        console.log(response.headers.getSetCookie()); // выводит []
        console.log(response.headers.get('Set-Cookie')); // выводит null
        if(!response) {
            throw new Error()
        }

    } catch (e) {
        console.error(e);
    }

Server.js

import express from 'express';
import cookieParser from 'cookie-parser';
import cors from 'cors';

const app = express();
app.use(cookieParser());

// Подключаем middleware для CORS
app.use(cors({
    origin: 'http://localhost:5173', // Указываем домен вашего фронтенда
    credentials: true // Разрешаем передачу куки
}));

// Обработчик POST запроса для аутентификации и установки Cookie
app.post('/login', (req, res) => {
    // В реальном приложении здесь будет происходить аутентификация пользователя

    // Устанавливаем Cookie
    res.cookie('userId', '123456789', { maxAge: 900000, httpOnly: true });

    // Отправляем ответ
    res.send('Login successful. Cookie set.');
});

// Пример защищенного ресурса, который требует наличие Cookie
app.get('/protected/resource', (req, res) => {
    // Проверяем наличие Cookie
    const userId = req.cookies.userId;

    if (userId) {
        res.json({ message: 'Protected resource accessed successfully.' });
    } else {
        // Если Cookie отсутствует, возвращаем ошибку
        res.status(401).json({ error: 'Unauthorized. User not logged in.' });
    }
});

// Запуск сервера на порту 3000
app.listen(3000, () => {
    console.log('Fake API server running on port 3000');
});

Ответы (1 шт):

Автор решения: Alexey Ten

Никак не достать.

Спецификация явно запрещает любой доступ к заголовкам Set-Cookie из JS.

Вы можете получить значение куки из document.cookie при условии что кука поставилась на домен текущей страницы и не имела флаг httpOnly.

→ Ссылка