Почему не устанавливаются куки при кросс-доменном запросе? [This set-cookie domain attribute was invalid with regards to the current host url]

В качестве сервера использую Open Server, в качестве фронтентда - React.js (с которого шлю асинхронные запросы на бэк), в качестве бэка - Laravel 7 (с пакетом Sanctum). Делаю авторизацию для SPA.

По идее, когда я отправляю запрос с фронта на бэк http://localhost:8000/sanctum/csrf-cookie, то сервер должен установить куку для фронта, и куки действительно приходят, но не устанавливаются. В Chrome показывает предупреждение: This set-cookie domain attribute was invalid with regards to the current host url.

Скриншот с проблемой

React.js с запросами axios:

  const onsubmit = e => {

    e.preventDefault();
    axios.defaults.withCredentials = true;
    
    axios.get('http://localhost:8000/sanctum/csrf-cookie').then(response => {
      
      axios.post(`http://localhost:8000/login`, {
        email: '[email protected]',
        password: 'anypassword',
      }).then(response => {
      
        console.log(response)
      })
    })
    

    axios.get('http://localhost:8000/api/user').then(response => {
      console.log('User request: ' + response.data)
    })

  }
При клике на кнопку запускается onsubmit().

Настройку Laravel Sanctum делал по документации. Изменения в cors.php, session.php, api.php, sanctum.php, Kernel.php и .env. Laravel подключен к БД и в БД создан пользователь. Показывать весь код не вижу смысла, так как сервер скорее всего работает правильно и кода придётся вставлять сюда много.

Кто сталкивался с ошибкой This set-cookie domain attribute was invalid with regards to the current host url и как её решить?


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

Автор решения: Dauren

В .env файле установи

SESSION_DRIVER=cookie
SESSION_DOMAIN=localhost
SANCTUM_STATEFUL_DOMAINS=localhost:3001

3001 - порт, на котором запущен react, в твоем случае 3001

→ Ссылка