如何通过 ajax 和 jquery 向 REST 控制器发出请求并在我的 JSP 中使用数据？答案

【问题标题】：How do I make a request to a REST controller and use data in my JSP with ajax and jquery?如何通过 ajax 和 jquery 向 REST 控制器发出请求并在我的 JSP 中使用数据？
【发布时间】：2023-03-21 18:19:01
【问题描述】：

正如标题所说，我不确定如何向控制器发出请求并获取数据并在我的 jsp 上使用它。假设我有这个控制器，它返回一个用户对象列表，列表

    @RequestMapping(value = "/findUsers", method = {RequestMethod.GET, RequestMethod.PUT}, consumes = {MediaType.APPLICATION_JSON_VALUE}, produces = {MediaType.APPLICATION_JSON_VALUE})
public ResponseEntity<BaseAjaxResponse<List<UserDto>>> findUsers( @RequestBody UsersDto utenteDto ){
    //LOGIC GOES HERE
    return ResponseEntity.status(status).body(response);
}

现在，在我的 JSP 文件中，我写了这样的内容。

    <form>
       <input type="text" placeholder="name" id="name" value="name">
       <input type="text" placeholder="surname" id="surname" value="surname">
     <button type="submit" id="search">
    </form>

这是我的 js。

     $("#search").click( function(evt){
    evt.preventDefault();
    searchUser();
}

    function searchUser(){
    var Url = "/findUsers"
    var User = new Object();
    User.name = $("#name").val();
    User.surname = $("#surname").val();
    $.ajax({
    url : handleContattoUrl,
    dataType : 'json',
    contentType : 'application/json; charset=UTF-8',
    type : 'POST',
    data: JSON.stringify(User)
});

在这里我被卡住了......我如何取回数据并使用它？

【问题讨论】：

标签： jquery ajax rest spring-mvc jsp

【解决方案1】：

首先我会保持简单。

也许像这样改变你的控制器。重要的是你告诉你的控制器你想要处理什么参数。您可以使用@RequestParam 或@PathVariable 告诉控制器您要发送哪些数据给它。

@RequestMapping(value="/findUsers") 
public @ResponseBody String findUsers (
    @RequestParam (required=false) String name, 
    @RequestParam (required=false) String surname) {

    ... // do something with the params

    return "everything worked fine";
}

告诉控制器它负责整个域的一部分是常识，因为这会使您的代码更易于理解。

@Controller
@RequestMapping(value="/user")

如果你这样做，那么你的函数中不需要前导斜杠。

@RequestMapping(value="findUsers")

所以请求 URL 将是“mydomain.com/user/findUsers”

同样重要的是，在您的 html 代码中，输入字段设置了 name 属性，因为这是控制器在检查请求时引用的参数的名称。否则，您的控制器将不知道它应该处理哪些参数。像这样

<input type="text" placeholder="name" id="name" value="name" name="name">

最后但并非最不重要的是您的 ajax 请求。通常您不需要指定响应数据类型，因为它会自动选择。 url 不是直接写入的，因为这样，如果您在测试环境或实时系统中，url 将始终有效。你可以导入 JSTL 做使用这个标签。

var name = $("#name").val();
var surname = $("#surname").val();

$.ajax({
    type: "POST",
    url: "<c:url value='/user/findUsers' />",
    data: {name: name, surname: surname},
    success: function(result) {
        ... // do something on success
    },
    error: function(error) {
        ... // catch error
    }
});

即使有更复杂的变化，这对我来说也很完美。

【讨论】：