使用AJAX将数据发送到弹簧控制器

时间:2018-07-30 14:13:11

标签: java ajax spring spring-mvc model-view-controller

我知道这个问题已经问过很多遍了,但是我已经查看了我可以找到的每个变体,但仍然无法找出我的问题。

这是我的ajax调用:

function sendFormData(endpoint) {
    console.log("CLICKING BUTTON");

    var input = {
            "userInputOne": "hello1", 
            "userInputTwo": "hello2", 
            "userInputThree": "hello3", 
            "userInputFour": "hello4", 
            "userInputFive": "hello5"
    }

    $.ajax({
        type:"post",
        contentType: "application/json",
        data: JSON.stringify(input),
        url: endpoint,
        asynch: false,
        success: function() {
            alert("success");
        } 

    });

}

端点正常工作。你可以相信我的话。

Spring控制器:

@RequestMapping(value = "endpoint", method = RequestMethod.POST)
        private @ResponseBody String getFormData(@RequestBody FormInput userInput, HttpServletRequest request, final ModelMap model) {

        String userInput1 = userInput.getInputOne();
        String userInput2 =  userInput.getInputTwo();
        String userInput3 = userInput.getInputThree();;
        String userInput4 = userInput.getInputFour();
        String userInput5 = userInput.getInputFive();

        return "success";

    }

这是我的模型课:

public class FormInput {
    private String userInputOne;
    private String userInputTwo;
    private String userInputThree;
    private String userInputFour;
    private String userInputFive;

    public FormInput(String userInputOne, String userInputTwo, String userInputThree, String userInputFour, String userInputFive) {
        this.userInputOne = userInputOne;
        this.userInputTwo = userInputTwo;
        this.userInputThree = userInputThree;
        this.userInputFour = userInputFour;
        this.userInputFive = userInputFive;
    }

    public String getUserInputOne() {
        return this.userInputOne;
    }

    public String getUserInputTwo() {
        return this.userInputTwo;
    }

    public String getUserInputThree() {
        return this.userInputThree;
    }

    public String getUserInputFour() {
        return this.userInputFour;
    }

    public String getUserInputFive() {
        return this.userInputFive;
    }

}

我一直收到415的HTTP状态代码,这意味着不受支持的媒体类型。我将contentType设置为“ application / json”,并且我还尝试将“ consumes ='application / json'”添加到我的Spring控制器,但这也没有帮助。感谢您提供的任何帮助。

编辑:将RequestMethod.GET更改为RequestMethod.POST后,现在出现以下错误:“错误405:不支持请求方法'GET'”

4 个答案:

答案 0 :(得分:0)

您编写的Java控制器方法的类型为“ GET”,应将其更改为“ POST”,因为您正在进行的Ajax调用也属于POST类型 试试这个,它将起作用

@RequestMapping(value = "endpoint", method = RequestMethod.POST)
            private @ResponseBody String getFormData(@RequestBody FormInput userInput, HttpServletRequest request, final ModelMap model) {

            String userInput1 = userInput.getInputOne();
            String userInput2 =  userInput.getInputTwo();
            String userInput3 = userInput.getInputThree();;
            String userInput4 = userInput.getInputFour();
            String userInput5 = userInput.getInputFive();

            return "success";

        }

答案 1 :(得分:0)

我猜主要问题是不匹配http方法。您是通过POST方法发送的,但控制器正在等待GET方法。

答案 2 :(得分:0)

无需发送参数json,这使事情变得复杂

在javascript代码中,您可以删除contentType: "application/json",并更改data属性的格式以直接发送数据

function sendFormData(endpoint) {
    console.log("CLICKING BUTTON");

    var input = {
            "userInputOne": "hello1", 
            "userInputTwo": "hello2", 
            "userInputThree": "hello3", 
            "userInputFour": "hello4", 
            "userInputFive": "hello5"
    }

    $.ajax({
        type:"post",
        //contentType: "application/json",
        data: input,//send data directly
        url: endpoint,
        asynch: false,
        success: function() {
            alert("success");
        } 

    });

}

在Java代码中,您可以在@ResponseBody之前删除FormInput注释

@RequestMapping(value = "endpoint", method = RequestMethod.POST)
private @ResponseBody String getFormData(FormInput userInput, HttpServletRequest request, final ModelMap model) {

        String userInput1 = userInput.getInputOne();
        String userInput2 =  userInput.getInputTwo();
        String userInput3 = userInput.getInputThree();;
        String userInput4 = userInput.getInputFour();
        String userInput5 = userInput.getInputFive();

        return "success";

}

答案 3 :(得分:0)

这是因为您的方法签名不匹配。只需删除contentType: "application/json"