时间戳

首页 > 解决方案 > ajax 调用返回 404

jquery - ajax 调用返回 404

问题描述

我正在尝试将我的表单作为 JSON 数据提交给控制器以进行进一步处理。我正在使用 jquery 并使用以下代码提交数据：

我的js代码：

    $(document).ready(function(){
        alert('hi');
        $("#btn-save").click(function(event) {
               var data = {}
               alert($("#name").val());
            data["name"] = $("#name").val();
            data["address"] = $("#address").val();
            data["phone"] = $("#phone").val();
            data["zipCode"] = $("#zipCode").val();
            $("#btn-save").prop("disabled", true);
            alert('1'+JSON.stringify(data));
            $.ajax({
                 type: "POST",
                 contentType: "application/json",
                 url: "/saveUser",
                 data: JSON.stringify(data),
                 dataType: 'json',
                 timeout: 600000,
                 success: function (data) {
                    alert('success');
                 },
                 error: function(xhr, status, error){
                     var errorMessage = xhr.status + ': ' + xhr.statusText
                     alert('Error - ' + errorMessage);
                 }
        });
           });
    });
</script>

我已经编写了我的控制器类，它可以处理请求。但执行永远不会到达这个方法。预计这将调用控制器类：

@RequestMapping(value = "/saveUser", method = RequestMethod.POST)
public @ResponseBody SysUserDto  saveUser(@RequestBody SysUserDto user) {
    System.out.println("Save code******");
    return user;
}

我什至尝试不使用响应正文并将返回作为 void 而不是 SysUserDto 但是当执行进入错误块时，我看到 404 错误。请帮忙

标签： jqueryajaxspringspring-mvc

解决方案

你可以试试这个。假设您的表单 ID 称为“uploadForm”

 $(document).ready(function(){
            alert('hi');
            $("#btn-save").click(function(event) {
             event.preventDefault();
             var user= new FormData($('#uploadForm')[0]);        
                $.ajax({
                    contentType : false,
                    processData : false,
                     type: 'POST',
                     url: "/saveUser",
                     data: user,
                     timeout: 600000,
                     success: function (data) {
                        alert('success');
                     },
                     error: function(xhr, status, error){
                         var errorMessage = xhr.status + ': ' + xhr.statusText
                         alert('Error - ' + errorMessage);
                     }
            });
               });
        });
    </script>

控制器：

@RequestMapping(value = "/saveUser", method = RequestMethod.POST)
public @ResponseBody String saveUser(SysUserDto user) {
    System.out.println("Save code******");
    ObjectMapper mapper = new ObjectMapper();
    String json = mapper.writeValueAsString(user);
    System.out.println(json);
    return json;
}

ObjectMapper来自杰克逊图书馆。

推荐阅读