欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

vue添加請求頭

錢諍諍1年前8瀏覽0評論

當我們使用Vue進行網絡請求的時候,我們需要想辦法把一些自定義的頭部信息加到HTTP的請求中。這個時候,我們可以使用axios這個插件來進行網絡請求。

// 引入axios
import axios from 'axios'
// 創建axios實例
const instance = axios.create({
baseURL: 'http://localhost:3000',
timeout: 10000,
headers: {
'Content-Type': 'application/json;charset=UTF-8'
}
})
// 添加請求攔截器
instance.interceptors.request.use(
config =>{
// 在請求頭中添加token
config.headers.Authorization = `Bearer ${localStorage.getItem('token')}`
return config
},
error =>{
return Promise.reject(error)
}
)
// 發送請求
instance.get('/api/users').then(response =>{
console.log(response)
})

我們來看一下上面的代碼。首先,我們引入了axios插件,并且使用axios.create()方法創建了一個axios實例。在這個實例中,我們設置了基本的請求URL,請求的超時時間以及請求頭中默認的Content-Type和編碼方式。

在實例中,我們還添加了一個請求攔截器(interceptors.request),這個攔截器可以在請求發出之前對請求進行處理,比如可以在請求頭中添加一些自定義的信息。

在上面的代碼中,我們在請求頭Authorization字段中添加了一個token,這個token是從localStorage中獲取的。我們可以根據自己的需求在請求頭中添加任何想要添加的字段。

最后,我們通過instance.get()方法發送了一個GET請求,并且在請求的回調函數中輸出了響應的結果。

還有一種情況,可能是我們需要對每次請求的請求頭進行動態修改,而不是像上面那樣在請求攔截器中添加一個固定的token。這個時候,我們可以直接在發送請求時傳入一個配置對象,來動態修改請求頭。

// 發送請求
instance.get('/api/users', {
headers: {
'Authorization': `Bearer ${localStorage.getItem('token')}`
}
}).then(response =>{
console.log(response)
})

在上面的代碼中,我們通過傳入一個配置對象的方式來動態修改請求頭。在這個配置對象中,我們可以修改請求頭的任何字段,并且這個修改是針對當前的請求有效。

總結起來,當我們需要在Vue中進行網絡請求并且需要自定義請求頭信息的時候,我們可以使用axios這個插件,并且在創建axios實例時添加請求攔截器或者在發送請求時傳入一個配置對象,來動態地修改請求頭信息。