一、问题描述：

当我输入没有注册的用户名和密码，直接给我跳转到了一个404页面，而不是显示提醒弹窗“账号或密码错误！”

我想要的正确效果如下：

二、分析

1.点击登录时发现后端在处理请求时抛出了一个异常：MissingServletRequestParameterException，具体原因是 缺少必需的请求参数 uname！

2.那么我们去看看前端的uname值有没有正确传递到后端，我们可以在发送请求前打印它的值看看：

将 console.log 放在 axios 请求之前，确保在发送请求前打印出 ruleForm.value.uname 的值。

然后在控制台console可以看到：

 

图中有用户名和密码！！说明这里我的前端代码是正确传递了 uname 和 password 参数的！！

当时虽然参数都正确了，但请求仍然失败，返回了 400 Bad Request 错误！！！（这个图是我后面成功了才截的，所以看不到）

400 Bad Request 错误的原因？

400 错误通常表示客户端发送的请求有问题，服务器无法正确处理。

最终解决措施如下：

（1）如果你的后端接口使用 @RequestBody，那么前端需要以 JSON 形式传递参数。即

  headers: {'Content-Type': 'application/json', // 使用 JSON 格式},

（2）如果后端接口使用的是 @RequestParam ，那么前端需要以表单形式传递参数。即

  headers: {'Content-Type': 'application/x-www-form-urlencoded', // 使用表单格式},

我的错误在于：我的后端是@RequestParam ，而前端是'application/json'，搞反了

===============

至此，终于跳转不是404页面！大功告成！！！