CORS Issue with Angular and Spring Boot REST API With Keycloak

Question

I've built Spring Boot REST API(2.3.2.RELEASE), Angular(v10) application using keycloak(jboss/keycloak:12.0.3) for authentication and authorization.

Spring Boot application has configured using KeycloakWebSecurityConfigurerAdapter, and Angular Frontend using "keycloak-angular": "^8.1.0","keycloak-js": "^12.0.2",

For the moment I could successfully login into the application with Angular frontend via keycloak login window. But there is a CORS error when trying to do a POST or GET request to Spring Boot REST API using HttpClient in Angular Project.

Token is correctly binding to the request. This token is valid because I could call this API using this same token via Postman.

Solutions I tried:

Setting web origin on keycloak admin to * - Not working
Setting keycloak.cors = false in application.properties in spring boot application - Not working
Setting cors.disable in Spring security configuration - Nor working

@Override
protected void configure(HttpSecurity http) throws Exception {
  super.configure(http);

  http.cors().disable();
}

It sounds like you're using Angular, since you specify version 10. Angular is a radically different framework than AngularJS. — JeffryHouser
CORS is a server side issue, and has nothing to do with angular. You need to enable cors on the server. A simple google should let you see many examples, e.g. here — Zonaib

Chinthaka Dinadasa Chinthaka Dinadasa · Accepted Answer · 2021-03-01T17:38:21

There was an error in my configuration for cors, so basically your keycloak setup should be done with spring security as follows, It will resolve any kind of CORS related issues with Spring boot and Keycloak.

Go to the admin console of Keycloak and set 'Web Origins' of your client to address of your application web frontend application (eg:- http://localhost:42) (or just * ).
In your application.properties set keycloak.cors = true

CORS Issue with Angular and Spring Boot REST API With Keycloak

1 Answers