Angular JS, Jetty CORS issue

Question

I've been ripping my hair out over this issue. Im attempting to enable CORS between an Angular App and a Jersey Server. Basically I've implemented a filter for jersey that should allow angular access to the server:

public class SimpleCORSFilter implements ContainerResponseFilter {
/**
 * Add the cross domain data to the output if needed
 * 
 * @param creq The container request (input)
 * @param cres The container request (output)
 * @return The output request with cross domain if needed
 */
@Override
public ContainerResponse filter(ContainerRequest creq, ContainerResponse cres) {
    cres.getHttpHeaders().add("Access-Control-Allow-Origin", "*");
    cres.getHttpHeaders().add("Access-Control-Allow-Headers", "origin, content-type, accept, authorization");
    cres.getHttpHeaders().add("Access-Control-Allow-Credentials", "true");
    cres.getHttpHeaders().add("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS, HEAD");
    cres.getHttpHeaders().add("Access-Control-Max-Age", "1209600");
    return cres;
}
}

I've then added this as an init param to my web.xml.

<init-param>
<param-name>com.sun.jersey.spi.container.ContainerResponseFilters</param-name>
<param-value>com.complaints.security.SimpleCORSFilter</param-value>
</init-param>

When I hit the URL - mysite:8080/ComplaintService/service/user/authenticate from postman with a post containing user details it returns fine (as is expected from postman) and the header contains all the correct CORS related headers. When I try to make the call from angular for some reason none of the CORS headers are being returned and it fails. Even if I just hit the URL from the browser as a GET the CORS headers are being returned. This is my angular call:

$http.post('http://mysite:8080/ComplaintService/service/user/authenticate', user).then(function(data) {
        alert(JSON.stringify(data));
    });

Basically I'm just wondering am I missing something simple? Or perhaps could it be related to the spring security filter? I was thinking the application could potentially be blocked from reaching the jersey filter. Here's the spring filter:

<filter>
    <filter-name>springSecurityFilterChain</filter-name>
    <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class>
</filter>
<filter-mapping>
    <filter-name>springSecurityFilterChain</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

Angular is currently deployed on jersey - mysite:8081 and the server is deployed on mysite:8080. Any help would be greatly appreciated!

Answer 1

I overcame this issue using a library - com.thetransactioncompany:cors-filter:1.3.2 and adding some config to my web.xml.

<filter>
    <filter-name>CORS</filter-name>
    <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
    <init-param>
        <param-name>cors.allowOrigin</param-name>
        <param-value>*</param-value>
    </init-param>
    <init-param>
        <param-name>cors.supportedHeaders</param-name>
        <param-value>origin, content-type, accept</param-value>
    </init-param>
    <init-param>
        <param-name>cors.allowGenericHttpRequests</param-name>
        <param-value>true</param-value>
    </init-param>
    <init-param>
        <param-name>cors.supportedMethods</param-name>
        <param-value>GET, POST, HEAD, PUT, DELETE</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>CORS</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

I think the issue was because the spring security filter was being called first, this seemed to resolve the issue.