[keycloak-user] Secure CORS configuration

[Jan Garaj]

Hello,

I would like to use https://github.com/damienbod/angular-auth-oidc-client/,
but this library has CORS problem with userinfo endpoint query from Firefox
(Chrome has a similar CORS error):
*Cross-Origin Request Blocked: The Same Origin Policy disallows reading the
remote resource at
https://<keycloak>/auth/realms/<realm>/protocol/openid-connect/userinfo.
(Reason: CORS header ‘Access-Control-Allow-Origin’ missing).*

All resources, which I found are recommending to configure Keycloak CORS
header Access-Control-Allow-Origin: *, which is not a secure option:
https://stackoverflow.com/questions/45051923/keycloak-angular-no-access-control-allow-origin-header-is-present
http://lists.jboss.org/pipermail/keycloak-user/2017-September/011890.html
+ it looks like this insecure option is not available anymore, because
https://issues.jboss.org/browse/KEYCLOAK-5946 has been implemented.

So my question is: how to configure Keycloak (server, OIDC client) for
secure cross requests?

Fortunately, Google IdP works fine for my use case, so I'm able to check
preflight headers. Google IdP:

$ curl "https://www.googleapis.com/oauth2/v3/userinfo" \ -v -X OPTIONS
-H "Host: www.googleapis.com" \
 -H "Access-Control-Request-Method: GET" \
 -H "Access-Control-Request-Headers: authorization" \
 -H "Origin: https://domain.com"...
< HTTP/1.1 200 OK
< Cache-Control: no-cache, no-store, max-age=0, must-revalidate
< Pragma: no-cache
< Expires: Mon, 01 Jan 1990 00:00:00 GMT
< Date: Thu, 02 Aug 2018 06:29:07 GMT
< Access-Control-Allow-Credentials: true
< Access-Control-Allow-Headers: authorization
< Access-Control-Allow-Methods: DELETE,GET,HEAD,PATCH,POST,PUT
< Access-Control-Allow-Origin: https://domain.com< Access-Control-Max-Age: 3600
< Vary: Origin
< Vary: X-Origin
< Content-Type: application/octet-stream
< X-Content-Type-Options: nosniff
< X-Frame-Options: SAMEORIGIN
< X-XSS-Protection: 1; mode=block
< Content-Length: 0
< Server: GSE
< Alt-Svc: quic=":443"; ma=2592000; v="44,43,39,35"

My Keycloak 4.2:

$ curl "https://<keycloak>/auth/realms/<realm>/protocol/openid-connect/userinfo"
\-v -X OPTIONS -H "Host: <keycloak>" \
-H "Access-Control-Request-Method: GET" \
-H "Access-Control-Request-Headers: authorization" \
-H "Origin: https://domain.com"...
< HTTP/1.1 200 OK
< Connection: keep-alive
< Access-Control-Allow-Origin: https://domain.com<
Access-Control-Allow-Headers: Origin, Accept, X-Requested-With,
Content-Type, Access-Control-Request-Method,
Access-Control-Request-Headers, Authorization
< Access-Control-Allow-Credentials: true
< Content-Length: 0
< Access-Control-Allow-Methods: GET, HEAD, OPTIONS
< Access-Control-Max-Age: 3600
< Date: Thu, 02 Aug 2018 06:30:44 GMT

Keycloak is not able to add additional headers into the preflight response,
so I'm not able to verify, that those additional Google headers (Vary,
Content-Type, ....) will be able to solve my Keycloak CORS issue.
Definitely, it works in my Firefox if "CORS Everywhere" plugin is
activated, so it seems to be an issue with Keycloak preflight response
headers.

My test setup:
Docker image jboss/keycloak:4.2.0.Final (tested also with 3.x)
angular-auth-oidc-client 6.x, angular 6.x

Many thanks in advance.

*Jan Garaj*