Запрос завершается с ошибкой при наличии токена-носителя в заголовке запроса

#reactjs #fetch-api #bearer-token

#reactjs #fetch-api #токен-носитель

Вопрос:

Я столкнулся с проблемой с fetch API при отправке токена-носителя в заголовке запроса. Проблема в том, что запрос завершается с ошибкой при наличии этого токена в заголовке, но все работает нормально, когда в заголовке нет токена, и запрос может извлекаться. Есть идеи о том, как решить эту проблему? Я действительно ценю любую помощь.

 const url = "https://something.com"
const token = "something";
const options = {
headers: {
  Accept: "application/json",
  Authorization: "Bearer "   token
 }
};
fetch(url, options)
 .then((res) => {
 if (res.ok) {
   return res.json();
 } else {
   throw Error("Error!");
 }
})
.then((data) => {
        ...
 })
.catch((error) => {
        ...
});
  

Ответ №1:

Попробуйте изменить часть принятия:

Редактировать: Access-Control-Allow-Origin — это заголовок CORS (совместное использование ресурсов разных источников).

Когда сайт A пытается извлечь содержимое с сайта B, сайт B может отправить заголовок ответа Access-Control-Allow-Origin, чтобы сообщить браузеру, что содержимое этой страницы доступно для определенных источников. (Источником является домен, а также схема и номер порта.) По умолчанию страницы сайта B недоступны для любого другого источника; использование заголовка Access-Control-Allow-Origin открывает дверь для перекрестного доступа к определенным источникам запроса.

Для каждого ресурса / страницы, которые сайт B хочет сделать доступными для сайта A, сайт B должен обслуживать свои страницы с заголовком ответа:

 Access-Control-Allow-Origin: http://siteA.com
  

Нашел его в другом сообщении, тоже может помочь.

  const options = {
    headers: {
      Content-Type: "application/json",
      Authorization: `Bearer ${token}` //Change it too
    }
 };
  

Связанный с токеном, один из способов его передачи был бы таким:

  const options = {
    headers: {
      //Something else...

      Authorization: `Bearer ${yourToken}`
    }
 };