关于 springboot 的 ajax post 请求的问题

[karlguo7]

我使用 m1 Macbook 想做个 demo 玩玩，但是请求后端就开始报错了，请大佬帮忙看看。 使用 Springboot 2.2.6.RELEASE+thymeleaf+mybatis-plus+mysql

前端 js：

    function login() {
        $("#loginForm").validate({
            submitHandler: function (form) {
                doLogin();
            }
        });
    }

    function doLogin() {
        g_showLoading();//显示 loading 动画

        var mobile = $("#mobile").val();
        var inputPassword = $("#password").val();
        alert("mobile:" + mobile + ",password:" + inputPassword);
        var salt = g_password_salt;
        var str = "" + salt.charAt(0) + salt.charAt(2) + inputPassword + salt.charAt(5) + salt.charAt(4);
        var password = md5(str);//md5 加密
        console.log(password);//这里打印不出密码

        var data = {}
        data.mobile = mobile;
        data.password = password;

        $.ajax({
            url: '/login/doLogin',
            type: 'POST',
            dataType: "json",
            cache: false,
            //async: true,
            data: JSON.parse(data),
            success: function (data) {
                layer.closeAll();
                if (data.code === 200) {
                    layer.msg("登录成功");
                } else {
                    layer.msg(data.message);
                }
                //return false;
            },
            error: function () {
                layer.closeAll();
            }
        });
    }

controller：

@Controller
@RequestMapping(value = "/login" , method = {RequestMethod.GET,RequestMethod.POST})
@Slf4j
public class LoginController {
    @RequestMapping(value = "/toLogin", method = RequestMethod.GET)
    public String toLogin() {
        return "login";
    }

    @RequestMapping(value = "/doLogin", method = RequestMethod.POST)
    //@PostMapping("/doLogin")
    @ResponseBody
    public RespBean doLogin(@RequestBody LoginVo loginVo) {
        log.info("{}", loginVo.toString());
        System.out.println(loginVo.toString());

        return null;
    }

}

在浏览器输入 http://localhost:8080/login/toLogin 可以访问到页面，然后点击登录调用 doLogin()方法，前后后端没有报错，但是后端的打印也不会打印到控制台；但是去掉 @RequestMapping(value = "/login" , method = {RequestMethod.GET,RequestMethod.POST})类上面这个 method 的话会报 405 post not support 。 并且使用 postman 调用接口都会报 404，排查了好久都没有解决。

[Loku]

加上 contentType: "application/json"
JSON.parse 换成 JSON.stringify()

[karlguo7]

@Loku 加上之后后端的打印还是没有，chrome 里面 g_showLoading(); 以下的断点都不会进入 debug 。

[wangsongyan]

JSON.parse

[sheeta]

@RestController

[sheeta]

@sheeta 忽略...

[chendy]

浏览器 cmd + alt + i 开开发工具，切到网络，看看请求的 content-type 和 payload 是什么

[uselessVisitor]

检查 cors 跨域

[hello2060]

js 里肯定要改成 data: JSON.stringify(data)

而且你 LoginVo 定义是什么?

[hello2060]

你可以自己用 postman post 到 /login/doLogin 先试试请求能不能到, 甚至可以把 LoginVo 类型改成 String 看能不能收到.

debug 总是一步步来的. 如果
1 String 能收到
2 LoginVo 能收到

那就是 js 端的问题了

[cslive]

去掉 @RequestBody

[karlguo7]

@hello2060 LoginVo 定义了两个 String 的字短，postman 中不管调用 get 还是 post api 都会报 404

[karlguo7]

@hello2060 js 已经改掉了

[karlguo7]

@hello2060 #9 下面是 controller 和 postman 的截图，请问是 postman 配置的有问题吗？一直都是 404
https://i.loli.net/2021/05/26/pToMZReWvSJbju7.jpg?width=1748&height=512 https://i.loli.net/2021/05/26/HTf3dZQNBMeE9VP.jpg?width=1708&height=946

[hello2060]

@karlguo7 你这样子后端是拿不到参数的,你至少要指定 mobile 是 pathVariable 还是 requestBody, 是 string 还是 自定义类型.

但即使这样,后端的断点是会触发的,只不过你的 mobile 是 null

[karlguo7]

@hello2060 确实是 js 的问题...
```JavaScript
function doLogin(){
g_showLoading();//显示 loading 动画

var mobile = $("#mobile").val();
var inputPassword = $("#password").val();
var salt = g_password_salt;
var str = "" + salt.charAt(0) + salt.charAt(2) + inputPassword + salt.charAt(5) + salt.charAt(4);
var password = md5(str);//md5 加密
.......
}
```
JS 里面的 doLogin()调用的 g_showLoading()方法可能有问题，注释掉这个方法下面 js 的 debug 也进去了，后端也进去了，感谢。

[karlguo7]

@hello2060 但是 postman 不管是 get 还是 post 请求还是会报 404 page not found