vue axios全域性新增請求頭和引數操作

2021-10-19 12:42:26 字數 1119 閱讀 1577

走登入的介面都會返回乙個token值,然後存起來方便之後調介面的時候給後台傳過去,傳給後台的方式有兩種:(具體使用哪種需要和後台商量)

1、放在請求頭中

2、放在介面的引數中

1、放在請求頭中

下面**是從本地cookie中拿token

vuecookie:乙個用於處理瀏覽器cookies的簡單vue.js外掛程式.

// 在封裝axios的檔案中新增***// 新增請求***,在請求頭中加token

service.interceptors.request.use(config => else

return config

}, error => )

這個時候雖然在請求頭中放了token,但是後台並拿不到token的值,我們需要在建立axios物件的時候允許請求攜帶cokie,也可以加到main.js全域性裡面。

// 放在請求檔案中

const service = axios.create();

// 放在全域性main.js中

import axios from "axios";

axios.defaults.withcredentials = true; // 允許攜帶cookie

2、放在引數中以下**是從本地儲存localstorage中拿token

// 新增請求***,在引數中加token

service.interceptors.request.use(

config =>

} else if (config.method === 'get')

}} else

return config

},error => )

補充知識:如下所示:

transformrequest 方法說明axios中文文件

vue axios 請求封裝

import axios from axios import router from router index import from element ui import from utils loading import from utils auth import qs from qs 引入qs...

封裝vue axios請求

util.js import axios from axios import qs from qs import from vant h5用的這個 const apiurl xx 訪問介面位址 設定超時時間 請求頭等 axios.defaults.timeout 30000 axios.defaul...

vue axios請求封裝

在src檔案下自定義乙個api.js import axios from axios 建立乙個axios物件 const 建立乙個唯讀檔案 const instance axios.create 請求攔截 所有的網路請求都會先走這個方法 instance.interceptors.request.u...