在现代Web应用开发中,前后端分离架构已成为主流，前端（通常运行在 http://localhost:3000 或其他域名下）通过AJAX或Fetch API向后端Java服务器（如 http://api.example.com 或 http://localhost:8080）请求数据时，开发者常常会在浏览器控制台看到一个令人头疼的报错，这个报错的核心信息通常与“Cross-Origin Resource Sharing”或“CORS policy”有关，这便是我们常说的“Java跨域报错”。
要彻底理解和解决这个问题,我们需要从其根源——浏览器的安全策略谈起。
跨域问题的根源：同源策略
所谓“跨域”，指的是浏览器不能执行其他网站的脚本，它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制，同源策略是一个核心的安全基石，用于防止潜在恶意文档窃取数据。
“同源”的定义非常严格： 如果两个URL的协议、域名和端口都完全相同，那么它们就是同源的，任何一个环节不同，都会被视为“跨域”。
| URL A | URL B | 是否同源 | 原因 |
|---|---|---|---|
http://www.example.com/dir/page.html | http://www.example.com/dir2/other.html | 是 | 协议、域名、端口均相同 |
http://www.example.com/dir/page.html | https://www.example.com/dir/page.html | 否 | 协议不同 |
http://www.example.com/dir/page.html | http://api.example.com/dir/page.html | 否 | 域名不同 |
http://www.example.com/dir/page.html | http://www.example.com:8080/dir/page.html | 否 | 端口不同 |
当浏览器发现前端页面发起的XMLHttpRequest或Fetch请求是跨域的,它并不会直接阻止请求的发送，请求会正常抵达后端服务器，服务器也会处理请求并返回响应。关键在于，浏览器在接收到响应后，会检查响应头中是否包含了允许跨域访问的“许可证明”，如果缺少这个证明，浏览器就会拦截响应，并抛出我们看到的CORS错误，前端JavaScript代码则无法读取到响应的具体内容。
解决Java跨域报错的核心思想，不是在前端做文章，而是在后端Java服务器的响应中，添加特定的HTTP响应头，明确告诉浏览器：“我允许来自某个源的请求访问我的资源”。
主流解决方案：在Java后端配置CORS
对于Java后端,尤其是在Spring Boot框架下，有多种灵活且强大的方式来配置CORS。
解决方案一：使用原生Servlet过滤器
这是一种与框架无关的通用方法,适用于任何Java Web应用，我们可以创建一个过滤器，在所有请求处理之前，为HTTP响应对象添加必要的CORS响应头。
import javax.servlet.*;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class CorsFilter implements Filter {
@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
HttpServletResponse response = (HttpServletResponse) res;
// * 表示允许任何源，生产环境建议配置为具体域名
response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization, X-Requested-With");
chain.doFilter(req, res);
}
// init() 和 destroy() 方法实现...
} 这个过滤器需要配置在web.xml中或通过Spring Boot的@Configuration类进行注册，它简单直接，但缺乏灵活性，例如无法对不同API接口设置不同的跨域策略。
解决方案二：在Spring框架中优雅处理
Spring框架提供了对CORS的内置支持,配置起来更为便捷和强大。
局部跨域：@CrossOrigin注解
这是最简单的方式,可以直接在Controller类或具体的方法上添加@CrossOrigin注解。
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
@RestController
@CrossOrigin(origins = "http://localhost:3000") // 仅允许来自3000端口的请求
public class UserController {
@GetMapping("/users")
public List<User> getAllUsers() {
// ... 业务逻辑
}
@GetMapping("/public/info")
@CrossOrigin(origins = "*") // 该方法允许所有源访问
public String getPublicInfo() {
return "This is public information.";
}
} 这种方式的好处是粒度细,可以精确控制到每个接口，缺点是当接口众多时，会显得代码冗余，不利于统一管理。
全局跨域：实现WebMvcConfigurer
这是Spring Boot项目中推荐的最佳实践，通过实现WebMvcConfigurer接口并重写addCorsMappings方法，可以进行全局统一的跨域配置。
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**") // 对所有路径应用CORS配置
.allowedOrigins("http://localhost:3000", "https://my-frontend.com") // 允许的源
.allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS") // 允许的HTTP方法
.allowedHeaders("*") // 允许的请求头
.allowCredentials(true) // 是否允许发送Cookie信息
.maxAge(3600); // 预检请求的有效期，单位为秒
}
} 这种配置方式集中、清晰，易于维护，是管理整个应用跨域策略的理想选择。
集成Spring Security的跨域配置
如果项目中使用了Spring Security，CORS配置需要与Security配合进行，因为Spring Security的过滤器链优先级很高，可能会在CORS过滤器处理之前就拦截了请求，必须在Security配置中显式启用CORS支持。
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.web.SecurityFilterChain;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.CorsConfigurationSource;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import java.util.Arrays;
@Configuration
@EnableWebSecurity
public class SecurityConfig {
@Bean
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http
.cors().configurationSource(corsConfigurationSource()) // 启用CORS并使用自定义配置源
.and()
.csrf().disable() // 通常API需要禁用CSRF
.authorizeRequests()
.antMatchers("/public/**").permitAll()
.anyRequest().authenticated();
return http.build();
}
@Bean
public CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedOrigins(Arrays.asList("http://localhost:3000"));
configuration.setAllowedMethods(Arrays.asList("GET", "POST", "PUT", "DELETE", "OPTIONS"));
configuration.setAllowedHeaders(Arrays.asList("*"));
configuration.setAllowCredentials(true);
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
return source;
}
} 通过这种方式,Spring Security会正确处理预检请求（OPTIONS），并确保后续的CORS头部被正确添加。
相关问答FAQs
*问题1：我已经在后端配置了 `Access-Control-Allow-Origin: `，为什么浏览器还是报错，提示不允许使用凭证？**
解答： 这是一个非常常见的场景，当你的前端请求需要携带凭证信息，例如Cookie或使用了Authorization请求头进行认证时，浏览器对Access-Control-Allow-Origin的设置有更严格的要求，在这种情况下，你不能使用通配符，你必须将Access-Control-Allow-Origin设置为前端页面的具体源（如 http://localhost:3000），并且必须同时设置响应头 Access-Control-Allow-Credentials: true，在Spring的配置中，这对应着allowedOrigins("...")和allowCredentials(true)的同时设置，如果只设置allowCredentials(true)而allowedOrigins仍然是，浏览器会出于安全考虑拒绝响应。
问题2：前端和后端在同一个域名下，但端口不同（例如前端是 localhost:8080，后端是 localhost:9000），这算是跨域吗？
解答： 是的，这绝对算跨域，根据同源策略的定义，“源”由协议、域名和端口三者共同决定，只要其中任意一个不相同，就不属于同源。localhost:8080 和 localhost:9000 虽然协议（http）和域名（localhost）都相同，但端口（8080 vs 9000）不同，因此浏览器会判定它们为不同的源，发起的请求就是跨域请求，你依然需要在后端（运行在9000端口的服务）上按照上述方法进行CORS配置，才能让运行在8080端口的前端页面正常访问其API。
【版权声明】：本站所有内容均来自网络，若无意侵犯到您的权利，请及时与我们联系将尽快删除相关内容!
发表回复