Axios получает авторизацию, не работающую в Vue, но работающую на POSTMAN (метод Post в vue работал)

#api #vue.js #axios #authorization

#API #vue.js #axios #авторизация

Вопрос:

Я использую vue для клиентской части. И каким-то образом авторизация не работает с методом Get в axios. Я попытался использовать POSTMAN, и он работает так, как и должен быть. Есть ли вероятность, что я что-то пропустил?

 getCurrentPeriode() {
    return new Promise((resolve, reject) => {
        axios.get(TABLE_NAME,{params: {"X-API-KEY": API_KEY, command:"getCurrent"}}, {
            headers:{
                'Authorization': `Basic ${token}`
            }
        })
            .then((response) => {
                resolve(response.data[0])
            }) .catch(err => {
                reject(err.response.data)
            })
    })
}

Токен:

 const token = Buffer.from(`${username}:${password}`, 'utf8').toString('base64')

Я получаю эту ошибку: неперехваченный (в обещании) {статус: false, ошибка: «неавторизованный»}

В postman (это сработало):

Я пробовал использовать метод post в axios, и он работает. Да, я настроил CORS. Да, я разрешил метод Get на стороне моего сервера (потому что он работает в postman)

Метод Post работает как обычно, вот код:

 postNewPeriode(date) {
    return new Promise((resolve, reject) => {
        const data = new FormData()
        data.append("dateStart", date.dateStart)
        data.append("dateEnd", date.dateEnd)
        data.append("X-API-KEY",API_KEY)
        axios.post(TABLE_NAME,data, {
            headers:{
                "Content-Type": "application/x-www-form-urlencoded",
                "Authorization": `Basic ${token}`
            }
        })
            .then((response) => {
                resolve(response)
            }) .catch(err => {
                reject(err.response.data)
            })
    })
},

Я что-то упускаю в своем axios get или мне следует использовать другой подход? Спасибо за ответ

1. Можете ли вы показать другие заголовки, которые вы установили в Postman?

2. @Anatoly итак, проблема заключается в порядке параметров для get, ответ Богданца поможет мне. кстати, в postman я не устанавливал заголовок в post, для авторизации я установил его в Auth, и это сработало 🙂

Ответ №1:

Для Axios GET заголовки должны быть вторым аргументом, в то время как для PUT и POST тело является вторым, а заголовки — третьими, как вы и делали. Попробуйте использовать заголовки в качестве второго аргумента в GET.

Это должно сработать:

 axios.get( TABLE_NAME, 
          { 
            headers:{'Authorization': `Basic ${token}`}, 
            params: {"X-API-KEY": API_KEY, command:"getCurrent"}
          }
         )