Trying to GET data from application with Vue and Axios

Question

I'm trying to GET some data from our business server using a GET request with Vue and Axios. I encounter a 401 unauthorized error however. I'm able to GET this data with RESTED when I log in with my company account. I've already looked at this post: How to send Basic Auth with axios but no solution worked for me. This is my code to make the get request:

    await axios.get('http://192.168.*******', {}, {
      auth: {
        username: 'username',
        password: 'password'
      },
      headers: {
        'Content-Type': 'application/json'
      }
    });
  }

I've also tried without the 'headers'. This is the error message:

xhr.js:214          GET http://192.******** 401 (Unauthorized)
dispatchXhrRequest @ xhr.js:214

[Vue warn]: Unhandled error during execution of created hook 
  at <App>

createError.js:19 Uncaught (in promise) Error: Request failed with status code 401
    at createError (createError.js:19:15)
    at settle (settle.js:19:12)
    at XMLHttpRequest.onloadend (xhr.js:75:7)

Hopefully someone has an idea because I'm at a loss.

score 0 · Accepted Answer · answered Mar 23 '22 at 14:22

This solution has worked for me:

const config = {
  'Content-Type': 'application/json',
  "Accept": "application/json",
}
const { data } = await axios({ url: 'http://192.168.170.*****/', method: 'GET', data: null, withCredentials: true, headers: config })

Trying to GET data from application with Vue and Axios

1 Answers1