Cookie не устанавливается с помощью экспресса и паспорта

Question

Я долго пытался понять, почему это не работает.

Я реализую страницу входа в систему с помощью реакции. Эта страница отправляет пользователя и передается в бэкэнд (nodejs + express) с помощью axios:

const login = useCallback(e => {
    e.preventDefault()
    fetch(process.env.REACT_APP_HOST + '/login', {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        username: e.target.elements.username.value,
        password: e.target.elements.password.value
      })
    })
      .then(response => {
        if (response.ok) {
          return response.json()
        } else if (response.status === 401) {
          throw new Error('Invalid user or pass.')
        } else {
          throw new Error('An error ocurred')
        }
       ...
      })

  }, [])

В бэкэнде у меня есть маршрут, который получает эти данные и проверяет систему ldap. Поэтому я генерирую токен с помощью JWT и сохраняю его на токене

const express = require('express'),
    passport = require('passport'),
    bodyParser = require('body-parser'),
    jwt = require('jsonwebtoken'),
    cors = require('cors')
    cookieParser = require('cookie-parser')
    LdapStrategy = require('passport-ldapauth');

let app = express();
app.use(cookieParser())
app.use(cors());

....

app.post('/login', function (req, res, next) {

        passport.authenticate('ldapauth', { session: false }, function (err, user, info) {

            const token = jwt.sign(user, env.authSecret)
            res.cookie('cookie_token', token) //it doesn't set the cookie

            if (err) {
                return next(err)
            }
            if (!user) {
                res.sendStatus(401)
            } else {
                return res.status(200).send({ firstName: user.givenName});
            }
        })(req, res, next);
    });

Проблема в том, что токен пуст, он не установлен.

Answer 1

Пара вещей.В вашем методе пост-реакции на получение ответа вам нужно добавить

withCredentials: true,

рядом с httpheader.

 fetch(process.env.REACT_APP_HOST + '/login', {
  method: 'POST',
  withCredentials: true,
  credentials: 'include',
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    username: e.target.elements.username.value,
    password: e.target.elements.password.value
  })
})

После этого в вашей части nodejs вы используете cors, но проверяетевсе происхождение.Это не будет работать с учетными данными.Вы должны использовать cors, как это, чтобы проверить конкретное происхождение, а также повернуть учетные данные в true-

app.use(cors({credentials: true, origin: 'http://localhost:4200'}));

, после чего вы можете отправить свой cookie по

res.cookie('cookie_token', token, { maxAge: 900000 }) 

Таким образом, файл cookie прибудет, и как только файл cookie поступит на клиентскую сторону, вы можете получить файл cookie с помощью document.cookie или любого другого пакета, например «js-cookie»