ajax和springBoot完整的交互过程

在Spring Boot中，我们可以使用@RestController注解来创建REST API，并使用@RequestMapping注解来映射HTTP请求到具体的处理方法。对于AJAX请求，我们通常使用@GetMapping、@PostMapping等注解来处理不同的HTTP方法。

以下是一个简单的例子，展示了如何使用Spring Boot和AJAX完成一个完整的交互过程：

Spring Boot Controller:

import org.springframework.web.bind.annotation.*;
 
@RestController
@RequestMapping("/api")
public class MyController {
 
    @GetMapping("/greeting")
    public String greeting(@RequestParam(name = "name", defaultValue = "World") String name) {
        return "Hello, " + name + "!";
    }
}

AJAX请求:

$(document).ready(function() {
    $("#myButton").click(function() {
        var name = $("#nameInput").val();
        $.ajax({
            url: "/api/greeting?name=" + encodeURIComponent(name),
            type: "GET",
            success: function(response) {
                alert(response);
            },
            error: function(xhr, status, error) {
                console.error("An error occurred: " + status + "\nError: " + error);
            }
        });
    });
});

HTML:

<input type="text" id="nameInput" placeholder="Enter your name">
<button id="myButton">Say Hello</button>
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

在这个例子中，当用户点击按钮时，AJAX会发送一个GET请求到/api/greeting，并带上用户输入的名字。Spring Boot后端接收请求，处理并返回问候消息。AJAX成功响应时会弹出一个警告框显示返回的消息。