SpringSecurity + VUE + axios登錄form-data數據問題

 

問題描述:

前後端分離情況下 , 爲安全考慮 , 所有請求數據都放在requestBody中 , 即前端request payload中 , springsecurity默認從params中獲取數據 , 因爲 POST 請求使用 params 形式用戶名密碼會以 ?username=XXX&password=XXX 形式拼接在URL後面 , 如圖所示

 

 

  

但是 springsecurity 默認使用 param 形式獲取數據 , 如圖爲源代碼

 

初步解決方法:

重寫springsecurity 自帶的獲取參數類 UsernamePasswordAuthenticationFilter 中的 attemptAuthentication 方法 , 但是body中的數據只能讀一次 , 之後的remember-me無法讀取 , 造成功能的缺失

第二次解決辦法:

採用前端處理請求爲form-data 或 x-www-form-urlencoded 形式 , postman 測試沒有問題 , 但是axios發送成功 , 後端卻無法接收到數據 

最終採用辦法:

使用 qs 的 stringify 方法 , 傳輸的數據變爲了 form-data 形式

import qs from 'qs'

export function login(data) {
  return request({
    url: '/login',
    method: 'post',
    data: qs.stringify(data)
  })
}