CORS error in Spring Oauth2

Question

I'm using Spring security and Oauth2. But I'm new to Spring Oauth2, I Got the CORS error when front-end attends to access resource.

I'm using the below filter to allow other domains to access the resource:

@Component
@Order(Integer.MAX_VALUE)
public class SimpleCORSFilter implements Filter {

    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Credentials", "True");
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization");
        chain.doFilter(req, res);
    }


    public void init(FilterConfig filterConfig) {}
    public void destroy() {}

}

I wrote the below code to allow public resource in my SecurityConfiguration.java.

@Override
protected void configure(HttpSecurity http) throws Exception {
             http
        .authorizeRequests().antMatchers("/social/facebook/**","/register/**","/public/**").permitAll().and()
        .authorizeRequests().antMatchers("/user/**").hasRole("USER").and()           
        .exceptionHandling()
            .accessDeniedPage("/login.jsp?authorization_error=true")
            .and()
        .csrf()
            .requireCsrfProtectionMatcher(new AntPathRequestMatcher("/oauth/authorize")).disable();

}

For Oauth2, the below codes is for protecting user's resource in my OAuth2ServerConfig.java.

@Override
    public void configure(HttpSecurity http) throws Exception {
        http

            .requestMatchers().antMatchers("/user/**")
        .and()
            .authorizeRequests()
            .antMatchers("/user/**").access("#oauth2.hasScope('read')")
                .regexMatchers(HttpMethod.DELETE, "/oauth/users/([^/].*?)/tokens/.*")
                    .access("#oauth2.clientHasRole('ROLE_CLIENT') and (hasRole('ROLE_USER') or #oauth2.isClient()) and #oauth2.hasScope('write')")
                .regexMatchers(HttpMethod.GET, "/oauth/clients/([^/].*?)/users/.*")
                    .access("#oauth2.clientHasRole('ROLE_CLIENT') and (hasRole('ROLE_USER') or #oauth2.isClient()) and #oauth2.hasScope('read')")
                .regexMatchers(HttpMethod.GET, "/oauth/clients/.*")
                    .access("#oauth2.clientHasRole('ROLE_CLIENT') and #oauth2.isClient() and #oauth2.hasScope('read')");
    }

When I open the index.html file in the browser, like following:(Sorry I don't have at least 10 reputation to post images, so I paste links here)

http://i.stack.imgur.com/yQKJM.png

it successfully get the public data, that means other domains are allowed to access "/public/**" data.

But it failed to get "/user/**" data (protected by Oauth2). It gives me below error says "Cross-Origin Request Blocked".

http://i.stack.imgur.com/XIVx1.png

When I move the front-end files to the same domain of the Spring server. It works fine to get both "public" and "user" data as below:

http://i.stack.imgur.com/Q2n7F.png

The front-end and Back-end should be separated. But the CORS is blocked to access projected data. Can anyone give me some suggestions? Thanks very much. I'm guessing the filter is not working on Oauth2? still spend a lot of time on looking for solutions.

Answer 1

@Component
@Order(Ordered.HIGHEST_PRECEDENCE)

public class SimpleCORSFilter implements Filter {

    @Override
    public void init(FilterConfig fc) throws ServletException {
    }

    @Override
    public void doFilter(ServletRequest req, ServletResponse resp,
                         FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) resp;
        HttpServletRequest request = (HttpServletRequest) req;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "PATCH,POST,GET,OPTIONS,DELETE");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "x-requested-with, authorization, Content-Type, Authorization, credential, X-XSRF-TOKEN");

        if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
            response.setStatus(HttpServletResponse.SC_OK);
        } else {
            chain.doFilter(req, resp);
        }

    }

    @Override
    public void destroy() {
    }

}

Answer 2

I added the headers to the endpoints

@Override
    public void configure(AuthorizationServerEndpointsConfigurer endpoints)
            throws Exception {

        endpoints.addInterceptor(new HandlerInterceptorAdapter() {
            @Override
            public boolean preHandle(HttpServletRequest hsr, HttpServletResponse rs, Object o) throws Exception {
                rs.setHeader("Access-Control-Allow-Origin", "*");
                rs.setHeader("Access-Control-Allow-Methods", "GET,POST,OPTIONS");
                rs.setHeader("Access-Control-Max-Age", "3600");
                rs.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization");
                return true;
            }
        });


    }

Answer 3

The OAuth filter was called first and throw an Exception which has been prevented from running your CORS filter.

you must add this annotation

@Order(Ordered.HIGHEST_PRECEDENCE)

to your CORS filter.