В моем приложении для реагирования я использую axios для выполнения запросов REST api.
Но он не может отправить заголовок авторизации с запросом.
Вот мой код:
tokenPayload() {
let config = {
headers: {
'Authorization': 'Bearer ' + validToken()
}
}
Axios.post(
'http://localhost:8000/api/v1/get_token_payloads',
config
)
.then( ( response ) => {
console.log( response )
} )
.catch()
}
Здесь validToken()
метод просто вернет токен из хранилища браузера.
Все запросы содержат ответ об ошибке 500, в котором говорится, что
Токен не может быть проанализирован из запроса
из серверной части.
Как отправлять заголовок авторизации при каждом запросе? Вы бы порекомендовали какой-либо другой модуль с React?
axios
вообще проблема. проверьте своюvalidToken()
функцию, она возвращает то, что ваш сервер не понимает.Ответы:
Первый параметр - это URL.
Второй - это тело JSON, которое будет отправлено вместе с вашим запросом.
Третий параметр - заголовки (помимо прочего). Это тоже JSON.
источник
Bearer
следует использовать с большой буквы, не так ли?Вот уникальный способ установки токена авторизации в axios. Установка конфигурации для каждого вызова axios - не лучшая идея, и вы можете изменить токен авторизации по умолчанию:
Редактировать , спасибо Джейсону Норвуд-Янгу.
Некоторые API требуют, чтобы носитель был написан как носитель, поэтому вы можете:
Теперь вам не нужно настраивать конфигурацию для каждого вызова API. Теперь токен авторизации устанавливается для каждого вызова axios.
источник
Bearer
необходимо использовать заглавные буквы для некоторых API (я обнаружил на собственном горьком опыте).Второй параметр
axios.post
-data
(неconfig
).config
- третий параметр. Подробнее см. Здесь: https://github.com/mzabriskie/axios#axiosposturl-data-configисточник
Вы можете создать конфиг один раз и использовать его везде.
источник
headers: {'Authorization': 'Bearer '+token}
const instance = (token) => axios.create({ baseURL: `${config.API_URL}`, timeout: 1000, headers :{ 'authorization': 'Bearer ' + token } })
Используя перехватчик Axios:
источник
Если вы хотите получить некоторые данные после передачи токена в заголовке, чтобы попробовать этот код
источник
Это работает, и мне нужно установить токен только один раз в моем
app.js
:Затем я могу делать запросы в своих компонентах без повторной установки заголовка.
"axios": "^0.19.0",
источник
axios
сам по себе поставляется с двумя полезными «методами»,interceptors
которые являются не чем иным, как промежуточным программным обеспечением между запросом и ответом. так что если по каждому запросу вы хотите отправлять токен. Используйте расширениеinterceptor.request
.Я сделал пакет, который вам поможет:
Теперь вы можете использовать axios как класс
Я имею в виду, что реализация
middleware
зависит от вас, или, если вы предпочитаете создать свой собственныйaxios-es6-class
https://medium.com/@enetoOlveda/how-to-use-axios-typescript-like-a-pro-7c882f71e34a, это среда сообщение, откуда оно пришлоисточник
С этим я тоже столкнулся. Токен, который вы передаете, неверен.
Просто закодируйте токен и пройдите, вы получите правильный ответ. Но если токен не будет передан в одинарных кавычках '', то он обязательно выйдет из строя. Он должен быть в формате «Авторизация»: «Bearer YzE5ZTdiMjVlYzM5NjA2MGJkZTM5NjVlOTQ5YMmQ5ZjMwYjA0YmEzZmZjN2I1MmI4MDJkNQ», где после Bearer должны присутствовать одни очень важные одинарные кавычки.
IMP: приведенный выше код будет работать, но если вы разместите что-то вроде:
'Авторизация': 'Bearer' + YzE5ZTdiMjVlYzM5NjA2MGJkZTM5NjVlOTQ5YMmQ5ZjMwYjA0YmEzZmZjN2I1MmI4MDJkNQ, он завершится ошибкой
или ----- приведенный ниже код также не сработает, я надеюсь, вы понимаете основную разницу
источник