CORS error when calling POST request API

We are trying to build a Simple Page React Application with Spring Boot as a server.
The react application is OKTA protected using implicit flow. We have used the same OKTA application in spring boot side.

Frontend runs on port- 3000
Backend runs on port - 8080

We the frontend hits the backend API - http://localhost:8080/ckcapp/search/customer , we receive the following error.
Acess to XMLHttpRequest at ‘http://localhost:8080/ckcapp/search/customer’ from origin ‘http://localhost:3000’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

In backend config file, we have also set the following configuration

CorsConfigurationSource corsConfigurationSource() {
CorsConfiguration configuration = new CorsConfiguration();
configuration.setAllowedMethods(Arrays.asList(“GET”, “POST”,“OPTIONS”));
configuration.setAllowedHeaders(Arrays.asList(“authorization” , “contentType” ,“Origin”, “Content-Type”, “X-Auth-Token”));
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**", configuration);
configuration.addAllowedMethod(“GET, POST, OPTIONS”);;
return source;

Do we need anyother configuration ? or Do we have to change the flow to some other and not use the implicit flow ?

If you change the allowed headers to allow all, does it work?


Tried it. It doesn’t work.

Can you please try our Spring Boot + React example from GitHub?

git clone -b okta

See the project’s README for how to configure it to work with your Okta org.