How to fix cors error at my keycloak to make it work?

Question

I try to reach this keycloak endpoint: http://10.10.10.10:8999/auth/realms/demo-realm/protocol/openid-connect/token

I add the client_secret, grant_type and client_id. Then when I send the request from my frontend app, I get back this error:

Access to XMLHttpRequest at 'http://10.10.10.10:8999/auth/realms/demo-realm/protocol/openid-connect/token' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

My keycloak setup is the following:

-confidential client

-valid redirect URIs: *

-web origins: + or * (tried both)

Also tried to set valid uris to http://localhost:4200 and web origins + or add the http://localhost:4200 to web origins.

It's important that the client have to be confidential or the access_token won't contain a resource-id when I try to use it...

Thanks in advance

I find some posts about some problems with angular and confidential client, having problems like you. Somes argues that it do not accept http calls, others about * conflict. Can you serve your keycloak on https? — Claudio Weiler
No I can't. Only http. For example from Postman I can reach the endpoint and get back the access_token. — stackstack293
Requests with Postman are made with redirect_uri parameter? — Claudio Weiler
Did you check if the client you use includes the Origin header in the token request? Browsers usually do it, however other clients such as Postman don't do it by default. If you don't send an Origin header, no Access-Control-Allow-Origin will be set. — Philipp

Claudio Weiler Claudio Weiler · Accepted Answer · 2020-12-08T15:11:46

On keycloak client setup, add http://localhost:4200/* as valid redirect URI. In web origins a + is the best choice.

If you are using Java adapter, also set enable-cors tor true (see https://www.keycloak.org/docs/latest/securing_apps/index.html#_java_adapter_config)

How to fix cors error at my keycloak to make it work?

2 Answers