返回

【圣杯解封】终于搞定SpringBoot AJAX请求数据时路径正确仍报404错误,终于解脱了!

前端

解决 SpringBoot AJAX 请求的 404 错误

在使用 SpringBoot 开发应用程序时,你可能会遇到一个问题:明明路径没有问题,却总是报 404 错误。这可能是因为你的应用程序无法接受 AJAX 请求。

为什么 SpringBoot 默认情况下无法接受 AJAX 请求?

在 SpringBoot 中,控制器方法是使用传统的 Servlet API 进行映射的,而 Servlet API 并不支持跨域请求。因此,当你的 AJAX 请求来自一个不同的域时,就会被 SpringBoot 应用程序拒绝,并返回 404 错误。

解决方法

要解决这个问题,你需要对 SpringBoot 应用程序进行一些配置,使其能够接受 AJAX 请求。有几种方法可以实现这个目的:

1. 修改 SpringMVC 配置

你可以使用 @CrossOrigin 注解来指定哪些域可以访问你的应用程序。例如,以下配置允许来自 http://localhost:8080 域的所有请求访问你的应用程序:

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:8080")
                .allowedMethods("GET", "POST", "PUT", "DELETE")
                .maxAge(3600);
    }

}

2. 启用 CORS

CORS(Cross-Origin Resource Sharing)是一种允许不同域之间的资源共享的机制。你可以使用 @EnableCors 注解来启用 CORS。例如:

@SpringBootApplication
@EnableCors
public class Application {

    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }

}

3. 使用代理服务器

代理服务器是一种位于客户端和服务器之间的中间服务器。你可以通过代理服务器实现跨域请求。

代码示例

以下是一个使用 SpringBoot、AJAX 和 JQuery 的代码示例:

Controller.java

@RestController
public class MyController {

    @PostMapping("/api/data")
    public String data(@RequestBody String data) {
        return "Data received: " + data;
    }

}

index.html

<!DOCTYPE html>
<html>
<body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $.ajax({
            url: "/api/data",
            method: "POST",
            data: JSON.stringify({ "message": "Hello from AJAX" }),
            contentType: "application/json",
            success: function(response) {
                alert(response);
            }
        });
    </script>
</body>
</html>

结论

通过以上方法,你可以解决 SpringBoot AJAX 请求的 404 错误。现在,你的应用程序就可以接受来自不同域的 AJAX 请求了。

常见问题解答

  1. 为什么我的 AJAX 请求仍然报 404 错误?

    确保你已经正确配置了 SpringBoot 应用程序,并启用了 CORS。此外,检查你的 AJAX 请求是否发送到了正确的 URL。

  2. 我可以使用其他方法来解决这个问题吗?

    是的,你可以使用 JSONP、WebSocket 或其他跨域请求技术。

  3. 我的应用程序需要安全,如何启用 CORS 而不影响安全性?

    你可以通过使用预检请求、设置允许的标头和来源来安全地启用 CORS。

  4. 如何限制来自特定域的 AJAX 请求?

    你可以使用 @CrossOrigin 注解中的 allowedOrigins 属性来限制来自特定域的请求。

  5. 我可以使用代理服务器来解决所有跨域问题吗?

    代理服务器可以解决大多数跨域问题,但它可能会影响性能,并且在某些情况下可能不可用。