How to send the authorization header using Axios
Learn how to send the authorization header using Axios
To set headers in an Axios POST request, pass a third object to the axios.post()
call.
You might already be using the second parameter to send data, and if you pass 2 objects after the URL string, the first is the data and the second is the configuration object, where you add a headers
property containing another object:
axios.post(url, {
data: {
...
}
})
axios.post(url, {
//...data
}, {
headers: {
...
}
})
To set the authorization header, call it like this:
const token = '..your token..'
axios.post(url, {
//...data
}, {
headers: {
'Authorization': `Basic ${token}`
}
})
(the authorization token might differ, check with the app you’re using)
To set headers in an Axios GET request, pass a second object to the axios.get()
call, for example this is a GitHub GET request to /user
:
axios.get('https://api.github.com/user', {
headers: {
'Authorization': `token ${access_token}`
}
})
.then((res) => {
console.log(res.data)
})
.catch((error) => {
console.error(error)
})
I was doing some work with the WordPress API, and I had to authenticate to perform a POST request to a website.
The easiest way for me was to use basic authentication.
I was using Axios, so I set the Authorization
header to the POST request in this way:
const username = ''
const password = ''
const token = Buffer.from(`${username}:${password}`, 'utf8').toString('base64')
const url = 'https://...'
const data = {
...
}
axios.post(url, data, {
headers: {
'Authorization': `Basic ${token}`
},
})
→ I wrote 17 books to help you become a better developer, download them all at $0 cost by joining my newsletter
→ JOIN MY CODING BOOTCAMP, an amazing cohort course that will be a huge step up in your coding career - covering React, Next.js - next edition February 2025