Почему GET запрос преобразовывается в OPTIONS в axios?

Question

[dicem]

Суть следующая, имеется api на сервере, приложение на vue и метод посылающий запрос:

getCartInfo({cartToken} = {}) {
    return axios.get(`${apiURL}/order/cart`, {
      headers: {
        'cartToken': cartToken
      }
    })
  }

URL и токен поступают в метод валидно, проверял консоль логом.

Запрос преобразовывается в OPTIONS и headers который я прописывал почему то не был назначен, а ключ 'cartToken' в нижнем регистре ушел в Access-Control-Request-Headers.



Ну и соответственно без необходимого хэдера запрос возвращает 404.
Проверял в postman все ок, API отрабатывает без проблем, а на фронте совсем беда.

Answer 1

[Антон Антон]

https://developer.mozilla.org/ru/docs/Web/HTTP/CORS

Comments

[dicem]

совсем в CORS не шарю, буду рад если пояснишь

[Антон Антон]

отличии от “простых запросов” (обсуждено выше), "предварительные" запросы сначала отправляют HTTP-запрос методом OPTIONS к ресурсу на другом домене, чтобы определить, является ли фактический запрос безопасным для отправки. Кросс-сайтовые запросы предварительно просматриваются таким образом, так как они могут быть причастны к пользовательским данным.

В частности, запрос предварительно просматривается, если выполняется любое из следующих условий:

...

Или если, кроме заголовков, автоматически устанавливаемых пользовательским агентом (например, Connection, User-Agent, или любым другим заголовком с именем, определенным в спецификации Fetch как "имя запрещенного заголовка"), запрос включает любые заголовки, отличные от тех, которые спецификация Fetch определяет как "заголовок запроса CORS-безопасный заголовок запроса", а именно:

Accept
Accept-Language
Content-Language
Content-Type (но учтите дополнительные требования ниже)
Last-Event-ID
DPR
Save-Data
Viewport-Width
Width

[Антон Антон]

Нужно настроить сервер, на котором api, таким образом, чтобы он правильно обрабатывал CORS preflight запросы, в данном случае - отвечал, что заголовок cartToken разрешен. Это делается разными способами для разных веб-серверов.
Ну или можно перенести клиентскую часть и api на один домен и порт.

[dicem]

Антон Антон, другими словами нужно кумекать на сервере?

[dicem]

Антон Антон, Спасибо большое! Отметил...