Vue向SpringBoot传递Email参数失败，请求参数缺失报错排查

问题根源 #

报错MissingServletRequestParameterException表明后端@RequestParam要求的email查询参数未被正确传递。你的前端GET请求没有把email放到正确的位置，导致Spring无法识别该参数。

修复方案 #

1. 修正AuthService的请求参数传递 #

axios发送GET请求时，查询参数必须放在params字段中，否则会被当作请求配置而非参数。修改代码如下：

getUserByEmail(email) {
    return api.get("/auth/get", {
      params: { email }
    })
}

2. （可选）简化Vue组件代码 #

你定义的email计算属性只是直接返回invitedPlayer，可以直接传递原数据，减少不必要的计算：

const authService = new AuthService();
authService.getUserByEmail(this.invitedPlayer)

3. 优化Controller的Optional判断逻辑 #

findByEmail返回的Optional<User>永远不会为null，用isEmpty()判断更符合Optional的设计规范：

@GetMapping("/get")
public ResponseEntity<Optional<User>> getUserByEmail(@RequestParam String email) {
    Optional<User> user = userRepository.findByEmail(email);
    if (user.isEmpty()) {
        return new ResponseEntity<>(HttpStatus.NOT_FOUND);
    }
    return new ResponseEntity<>(user, HttpStatus.OK);
}

补充说明 #

GET请求的参数需要以?key=value的形式附加在URL后，axios会自动将params对象中的键值对拼接成查询字符串。如果不放在params里，参数不会被正确传递到后端，就会触发缺失参数的报错。

内容的提问来源于stack exchange，提问作者Robin Groot