1
votes

On WebSphere Liberty I have a back end that run on https://localhost:9443/context-root/objects. It works and i can test my REST APIs from a browser or postman.

I coded a Web UI in Angular with Visual Studio Code. When i try to test ('> ng serve') with Crome localhost:4200 with the UI http calls of the REST API i get errors:

  1. server.xml without CORS settings

    The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:4200' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
    

Response Headers

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:origin, content-type, accept, authorization 
Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS, HEAD
Access-Control-Allow-Origin:*
Access_Control_Max_Age:43200
Cache-Control:no-store, no-cache=set-cookie
Content-Length:284
Content-Type:application/json
  1. server.xml with CORS settings

    <cors domain="/context-root"
      allowedOrigins="http://localhost:4200"
      allowedMethods="GET, DELETE, POST, PUT"
      allowedHeaders="accept"
      allowCredentials="true"
      maxAge="3600" />
    

Error:

Failed to load https://localhost:9443/context-root/objects: The 'Access-Control-Allow-Origin' header contains multiple values 'http://localhost:4200, *', but only one is allowed. Origin 'http://localhost:4200' is therefore not allowed access.

Response headers:

Access-Control-Allow-Credentials:true
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:origin, content-type, accept, authorization
Access-Control-Allow-Methods:GET, POST, PUT, DELETE, OPTIONS, HEAD
Access-Control-Allow-Origin:http://localhost:4200
Access-Control-Allow-Origin:*
Access_Control_Max_Age:43200 

I am not sure why i get double values in the Response Headers and why in particular i get 2 allow-origin. Is there a way around this? thanks

1
Do you have code in your web app that is setting CORS response headers? The fact you are seeing CORS headers without configuring CORS in Liberty suggests as much and explains why with Liberty CORS setup you are getting duplicate headers. - Alasdair
thank you @Alasdair for your reply. I did not code anything from the Web App to add CORS setting. Here is how the REST API is called: this.http.get(requestURL,{withCredentials: true}) .catch(this.handleError); - Stefania Axo
Here is what i found on package-lock.json that has the Cors setting for dev = true ` "requires": { "component-emitter": "1.2.1", "component-inherit": "0.0.3", "debug": "2.3.3", "engine.io-parser": "1.3.2", "has-cors": "1.1.0", "indexof": "0.0.1", "parsejson": "0.0.3", "parseqs": "0.0.5", "parseuri": "0.0.5", "ws": "1.1.2", "xmlhttprequest-ssl": "1.5.3", "yeast": "0.1.2" },` - Stefania Axo
"has-cors": { "version": "1.1.0", "resolved": "registry.npmjs.org/has-cors/-/has-cors-1.1.0.tgz", "integrity": "sha1-XkdHk/fqmEPRu5nCPu9J/xJv/zk=", "dev": true }, - Stefania Axo
here is the General info on the Network tab on Crome Request URL: localhost:9443/context-root/objects Request Method:GET Status Code:200 OK Remote Address:127.0.0.1:9443 Referrer Policy:no-referrer-when-downgrade - Stefania Axo

1 Answers

0
votes

From the above comments to my answer came the solution.
There was a ContainerResponseFilter class that added programmatically the CORS settings all the times, either they were set in server.xml or not.
As a result each REST API call had them in all the Response .
I removed the filter class and that fixed the problem. thank you :-)

`

@Override
   public void filter( ContainerRequestContext requestContext,
         ContainerResponseContext responseContext )
         throws IOException
   {
      final int ACCESS_CONTROL_MAX_AGE_IN_SECONDS = 12 * 60 * 60;
      MultivaluedMap<String, Object> headers = responseContext.getHeaders();
      headers.add( "Access-Control-Allow-Credentials", "true" );
      headers.add( "Access-Control-Allow-Headers",
            "origin, content-type, accept, authorization" );
      headers.add( "Access-Control-Allow-Methods",
            "GET, POST, PUT, DELETE, OPTIONS, HEAD" );
      headers.add( "Access-Control-Allow-Origin", "*" );
      headers.add( "Access_Control_Max_Age",
            ACCESS_CONTROL_MAX_AGE_IN_SECONDS );
   }

`