Angular Keycloak The 'Access-Control-Allow-Origin' header contains multiple values '*

0
votes

I have deployed my front-end angular app with keycloak enabled. Also have a java rest based back-end for communication. When i run the app keycloak shows the login page, Then after i login it does not shows anything.

XMLHttpRequest cannot load http://test.ssdiary.com:2222/auth/realms/app1/protocol/openid-connect/token. Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header contains multiple values '*, http://test.ssdiary.com', but only one is allowed. Origin 'http://test.ssdiary.com' is therefore not allowed access.

GET http://test.ssdiary.com:2222/auth/realms/app1/protocol/openid-connect/login…ame.html/init?client_id=srms-frontend&origin=http%3A%2F%2Ftest.ssdiary.com 403 (Forbidden)strong text

Header from network tab

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:accept, authorization, content-type, x-requested-with
Access-Control-Allow-Methods:GET, POST, OPTIONS, PUT
Access-Control-Allow-Origin:*
Access-Control-Max-Age:1
Connection:keep-alive
Content-Length:0
Date:Fri, 09 Jun 2017 04:57:38 GMT
Server:WildFly/10
X-Powered-By:Undertow/1
1
angularjskeycloak
Can you show us your request headers? – 31piy
From console network tab. right? – boycod3
@31piy check the updated question – boycod3

1 Answers

0
votes

Please read the specifications of the Access-Control-Allow-Origin header here.

For requests without credentials, the server may specify "*" as a wildcard, thereby allowing any origin to access the resource.

You are setting Access-Control-Allow-Credentials:true in your request. Thus, multiple origins are not allowed to access the returned content. Try to send a single origin as the value of Access-Control-Allow-Origin from your server.