Angular前端无法获取Spring后端认证用户，CORS问题求助

Hey there, let's fix that CORS error you're hitting when trying to fetch the authenticated user from your Spring backend in Angular. Since you mentioned the auth works locally but the cross-domain call fails, the issue is definitely with how Spring handles cross-origin requests—especially since your getCurrentUser endpoint requires authentication, we need to make sure CORS is configured to allow credentials and the right origins.

Here are the most reliable solutions, ordered by recommendation:

1. Global CORS Configuration (Recommended for Full App) #

This approach sets up CORS rules across your entire Spring backend, so you don't have to repeat config for every controller. Create a configuration class:

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;

@Configuration
public class CorsConfig {

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration config = new CorsConfiguration();
        
        // Critical for authenticated requests: allows cookies/authorization headers to be sent cross-domain
        config.setAllowCredentials(true);
        
        // Replace with your Angular app's actual URL (e.g., http://localhost:4200 for local dev)
        config.addAllowedOrigin("http://localhost:4200");
        
        // Allow all headers your app uses (includes Authorization for JWT, etc.)
        config.addAllowedHeader("*");
        
        // Allow all HTTP methods (GET, POST, OPTIONS, etc. – covers preflight requests)
        config.addAllowedMethod("*");
        
        // Apply rules to all endpoints
        source.registerCorsConfiguration("/**", config);
        return new CorsFilter(source);
    }
}

Key Notes: #

• Never use * for allowedOrigins when allowCredentials is true – browsers block this combination for security reasons. Always specify your exact frontend URL.
• The OPTIONS preflight request (sent automatically by browsers for authenticated cross-domain calls) will be handled correctly with this setup.

2. Controller-Level CORS Configuration #

If you only need CORS for specific controllers or endpoints, use the @CrossOrigin annotation:

import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
// Apply CORS rules to all methods in this controller
@CrossOrigin(origins = "http://localhost:4200", allowCredentials = "true")
public class UserController {

    @GetMapping("/api/current-user")
    // Or apply to a single method instead of the whole controller
    // @CrossOrigin(origins = "http://localhost:4200", allowCredentials = "true")
    public User getCurrentUser() {
        // Your existing logic to return the authenticated user
        return ...;
    }
}

3. Angular Side Matching Config #

Don't forget to update your Angular HTTP call to send credentials (cookies/authorization headers) cross-domain:

import { HttpClient } from '@angular/common/http';

constructor(private http: HttpClient) {}

getCurrentUser() {
  // The `withCredentials` flag tells Angular to send auth-related data with the request
  return this.http.get('/api/current-user', { withCredentials: true });
}

Extra: Spring Security Integration #

If you're using Spring Security, make sure CORS is processed before security filters. Update your security config:

import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;

@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        // Enable CORS first to ensure preflight requests aren't blocked by security rules
        http.cors()
            .and()
            // Your existing security rules (auth requirements, etc.)
            .authorizeRequests()
            .antMatchers("/api/current-user").authenticated()
            ...;
    }
}

内容的提问来源于stack exchange，提问作者student4806