I got stuck with a cross origin cors issue with my project. I have to send a get request from my Angular2 app running on localhost:4200 to my Spring Boot backend running on localhost:8080 with some header attributes. the request i want to send looks like this:
test() {
let jwt = localStorage.getItem('token');
let headers = new Headers({
'Content-Type': 'application/json; charset=utf-8',
'Authorization': 'Bearer ' + jwt
});
let options = new RequestOptions({ headers: headers });
this.http.get('http://localhost:8080/service/events/byTeamId/1', options)
.map((response: Response) => response.json())
.subscribe(
data => console.log('Response: '+data),
err => console.log('error: '+err),
() => console.log('Secret Quote Complete')
);
}
But this request doesn't arrive on the server side how i'd like to have it. With Postman to test the api it works.
My Spring Boot Backend looks like this:
WebSecurityConfig.java:
@Configuration
@EnableWebSecurity
@EnableGlobalMethodSecurity(securedEnabled = true)
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {
private RedirectStrategy redirectStrategy = new DefaultRedirectStrategy();
@Autowired
private SimpleCorsFilter simpleCorsFilter;
@Resource
private UserDetailsServiceImpl userDetailsService;
@Resource
private JwtAuthenticationProvider jwtAuthenticationProvider;
@Override
protected void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/", "/home", "/login", "/register").permitAll()
.anyRequest().authenticated()
.and()
.addFilterBefore(simpleCorsFilter, ChannelProcessingFilter.class)
.addFilterBefore(jwtAuthenticationFilter(), UsernamePasswordAuthenticationFilter.class)
.logout()
.permitAll()
.and().csrf().disable();
}...
My SimpleCorsFilter looks like this:
@Component
public class SimpleCorsFilter implements Filter {
private final Logger log = LoggerFactory.getLogger(SimpleCorsFilter.class);
public SimpleCorsFilter() {
log.info("SimpleCORSFilter init");
}
@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
HttpServletRequest request = (HttpServletRequest) req;
HttpServletResponse response = (HttpServletResponse) res;
response.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
//response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");
response.setHeader("Access-Control-Max-Age", "3600");
response.setHeader("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With, remember-me, Authorization");
chain.doFilter(req, res);
}
@Override
public void init(FilterConfig filterConfig) {
}
@Override
public void destroy() {
}
}
Wit Postman it works properly:
But when I test it on my chrome browser I get:
So to me it looks like i don't receive the header properties like "Authorization" at my backend. I also see this by debugging the request in the spring boot backend. I just see "null" as header of this request.
Does anyone have an idea why i don't get my request headers correct at the api endpoint?
I already had a look here:
restlet.com/blog/2016/09/27/how-to-fix-cors-problems/
and looked into several similar issues posted on stackoverflow.
"Access-Control-Allow-Origin", "http://localhost:4200"to"Access-Control-Allow-Origin", "*"