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)
  })
}