axios是一款可以在瀏覽器和Node.js中使用的Promise based的http庫。Vue通過引入axios庫可以方便地處理http請求，為了能夠?qū)φ埱箢^做出相關(guān)設(shè)置，我們需要在請求前做出適當(dāng)?shù)奶幚怼?/p>

在使用axios時，可以通過設(shè)置config對象來配置需要展示給服務(wù)器的信息。其中，headers用于設(shè)置發(fā)出請求時需要攜帶的頭信息。比如，下面的代碼設(shè)置了請求頭的Content-Type為application/x-www-form-urlencoded，以此告訴服務(wù)器請求的內(nèi)容以URL編碼的形式發(fā)送。

axios({
method: 'post',
url: '/user',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
data: {
firstName: 'Fred',
lastName: 'Flintstone'
}
});

在有些應(yīng)用中，我們需要對請求頭進(jìn)行動態(tài)的配置。比如，我們需要在每次請求時添加一個token，以驗證當(dāng)前用戶是否可以訪問網(wǎng)站上的內(nèi)容。為了實現(xiàn)這個功能，可以在請求時從Vuex獲取token，然后將token添加到請求頭中。下面的代碼展示了如何為包含token的請求添加自定義頭部：

import axios from 'axios'
import store from '@/store'
axios.interceptors.request.use(
config =>{
// 從Vuex中獲取token
const token = store.state.token
// 如果存在token則添加到請求頭中
if (token) {
config.headers.Authorization = `Bearer ${token}`
}
return config
},
error =>{
return Promise.reject(error)
}
)

通過上面的代碼，我們可以為每個axios請求添加一個名為Authorization的請求頭。其中，Bearer是一個常用的身份驗證格式，可以用來告訴服務(wù)器，請求頭中包含了一個token。

除了添加自定義頭部，我們還可以使用攔截器進(jìn)行一些其他的自定義操作。在axios中，攔截器是一種可以攔截請求或響應(yīng)的方法。之所以有必要攔截請求或響應(yīng)，是因為在真實的應(yīng)用場景中，我們可能需要對請求或響應(yīng)進(jìn)行全局性的處理。比如，在攔截器中，我們可以統(tǒng)一處理錯誤、添加或修改請求頭、設(shè)置請求超時等。

下面是一個添加Loading動畫的攔截器。在發(fā)送請求時，我們會展示一個Loading動畫，等到請求完成后再關(guān)閉Loading。

import axios from 'axios'
import { Loading } from 'element-ui'
let loadingInstance
function startLoading() {
loadingInstance = Loading.service()
}
function endLoading() {
loadingInstance.close()
}
axios.interceptors.request.use(config =>{
startLoading()
return config
}, error =>{
return Promise.reject(error)
})
axios.interceptors.response.use(response =>{
endLoading()
return response
}, error =>{
endLoading()
return Promise.reject(error)
})

在上面的代碼中，我們需要引入UI庫中的Loading組件。在請求前，我們會調(diào)用startLoading()方法展示Loading，請求完成后，會調(diào)用endLoading()方法來關(guān)閉Loading。

總結(jié)來說，Vue中使用axios請求頭需要我們在請求前進(jìn)行適當(dāng)?shù)奶幚怼Ｎ覀兛梢酝ㄟ^配置headers對象來設(shè)置請求頭，也可以通過攔截器來對請求或響應(yīng)進(jìn)行全局性的處理。請求頭的設(shè)置可以是靜態(tài)的，也可以是動態(tài)的，這取決于您的應(yīng)用中是否需要使用到動態(tài)信息。通過合理的處理，我們可以更加方便地使用axios進(jìn)行http請求。