1. 程式人生 > >axios設定請求頭無效,採用axios請求攔截實現

axios設定請求頭無效,採用axios請求攔截實現

在專案實踐中,使用axios設定請求頭headers,結果在請求過程中請求頭中並沒有包含headers中設定的請求頭資訊,而且後臺也沒有接收到前臺設定的請求頭資訊,導致資料無法進行校驗,請求失敗

POST請求方式:

axios
.post(httpUrl, params, {
    headers: {
        token: 'asdhfkladfadfgajhdgajh'
    }
})
.then(res => {
    console.log(res);
})
.catch(err => {
    console.log(err)
})

檢視請求結果時,發現請求頭headers中並沒有設定的headers資訊,即沒有token

解決axios請求無法設定請求頭headers

axios.interceptors.request.use(
    config => {
        config.headers.token = 'adhfkadflajflakdlajsdhkj';
        return config;
    },
    error => {
        return Promise.reject(error);
    }
);

 設定請求攔截之後,每次傳送請求且在返回請求資料之前都會呼叫這個方法對請求頭進行設定