當你看到該文章時希望你已知曉什麼是跨域請求以及跨域請求的處理,本文不會贅述
本文背景基于Springboot2.3進行搭建,Controller中不會寫任何業務邏輯僅用于配合前端調試
Controller中使用的<code>R.success</code>為本人封裝的工具類,點選這裡可檢視代碼
在項目目錄下執行指令安裝axios
打開src路徑下的main.js檔案,在檔案中引入axios依賴并挂載到vue全局屬性中
發起GET請求調用的是axios中的get方法,點進去可以看到該方法接收了url和config兩個對象
發起簡單GET請求

發起簡單GET請求并攜帶參數
發起POST請求調用的是axios中的post方法,點進去可以看到該方法的參數清單有三個對象
發起簡單POST請求
發起POST請求并攜帶參數(一)
發起POST請求并攜帶參數(二)
上面說直接使用data傳遞參數是放在請求體中的,需要後端使用<code>@RequestBody</code>才能取到,這裡将參數改為路徑參數進行送出
除開GET、POST請求之外,還有PUT、DELETE等等類型的請求,這裡就不一一測試了,來了解一下上傳檔案
通過觀察可以發現Axios的請求都會接收一個config對象,可以在<code>node_modules/axios/index.d.ts</code>檔案看到該配置的詳細資訊:
配置項有很多,我也是個新人好多沒接觸過,這裡就簡單測試幾個其他随時用随時查,推薦一個Axios中文網
baseURL
baseURL是個比較常用的屬性,可以針對每個請求設定根位址,我們在發起請求時隻需要關注請求路徑即可
timeout
timeout也屬于比較常用的配置項,用于配置請求的逾時時間,機關是毫秒ms,設定為0代表不設定逾時時間
withCredentials
該屬性同樣比較常用,withCredentials的值為bool類型,用于設定是否允許攜帶Cookie,Axios請求預設是不允許攜帶Cookie的,可以通過Controller列印sessionID進行測試
Axios暫時就寫到這裡,了解這些日常開發基本不成問題了,用熟config後可以試着封裝一個工具類
作者多數為原創文章 ( 部分轉載已标出 ),目前資曆尚淺文章内描述可能有誤,對此造成的後果深表歉意,如有錯誤還望指正