SpringBoot 出现 Content type ‘application/x-www-form-urlencoded；charset=UTF-8‘ not supported

wsfw014

于 2023-12-13 22:03:10 发布

阅读量339

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/wsfw014/article/details/134983218

本文介绍了如何在后端使用JavaSpring框架的@PostMapping处理用户登录请求，并通过前端AJAX实现表单验证及异步登录。前端使用jQuery发送POST请求到后端API，进行简单的用户名和密码验证。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

后端實現代碼：

@PostMapping ("/login")
@ResponseBody
public Result login(@RequestBody User user){
    User loginUser = userService.login(user);
    return Result.success(loginUser);
}

前端用ajax來實現可以解決

$(function (){
    $('.login_btn').click(function (){
        // console.log('123');
        // console.log($('#username').val())
      
        if($('#username').val().length<1){
            return alert('用户名不能为空或者用户名不能小于1个字符')
        }
        if($('#password').val().length<1){
            return alert('密码不能为空或者密码不能小于1个字符')
        }
        let param={
            username :$('#username').val(),
            password :$('#password').val()
        }

        param=JSON.stringify(param)
        $.ajax({
            url: 'http://localhost:5555/api/user/login',
            type: 'POST',
            data: param,
            contentType: 'application/json;charset=UTF-8',
            dataType: 'json',
            success:function (res){
                console.log(res);
                if (res.code === '0') {
                    alert('登录成功')
                    location.href="http://localhost:5555/ui/index?username=" + res.data.username;
                }else{
                    alert(res.msg)
                }
            }
        })
    })
})

html頁面

注意： form中不再需要action