Solving CORS Issues in SpringBoot with SpringSecurity: A Step‑by‑Step Guide

What is a CORS problem?

CORS (Cross‑Origin Resource Sharing) occurs when a resource on one origin tries to access a resource on a different origin (different domain, sub‑domain, or port). If the target resource does not explicitly allow the cross‑origin request, the browser blocks it.

Demonstrating the issue

Using the mall project as an example, the front‑end runs on port 8090 while the back‑end runs on port 8080. Both share the same localhost host, but the different ports cause a CORS error when the front‑end calls the login API.

Initial login attempt

The login request triggers a CORS error because the browser blocks the cross‑origin call.

Solution: Global CORS configuration

Add a GlobalCorsConfig class that registers a CorsFilter bean to allow all origins, credentials, headers, and methods.

package com.macro.mall.config;</code>
<code>import org.springframework.context.annotation.Bean;</code>
<code>import org.springframework.context.annotation.Configuration;</code>
<code>import org.springframework.web.cors.CorsConfiguration;</code>
<code>import org.springframework.web.cors.UrlBasedCorsConfigurationSource;</code>
<code>import org.springframework.web.filter.CorsFilter;</code>

<code>@Configuration</code>
<code>public class GlobalCorsConfig {</code>
<code>    /**
     * Global CORS configuration
     */</code>
<code>    @Bean
    public CorsFilter corsFilter() {</code>
<code>        CorsConfiguration config = new CorsConfiguration();</code>
<code>        // allow all origins</code>
<code>        config.addAllowedOrigin("*");</code>
<code>        // allow credentials (cookies)</code>
<code>        config.setAllowCredentials(true);
        // allow all headers</code>
<code>        config.addAllowedHeader("*");</code>
<code>        // allow all HTTP methods</code>
<code>        config.addAllowedMethod("*");</code>
<code>        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();</code>
<code>        source.registerCorsConfiguration("/**", config);
        return new CorsFilter(source);
    }
}

After adding this configuration, the login request succeeds.

Allowing OPTIONS requests in SpringSecurity

SpringSecurity blocks the pre‑flight OPTIONS request for the /admin/info endpoint. Add the following to the configure(HttpSecurity http) method: .antMatchers(HttpMethod.OPTIONS).permitAll() Now the OPTIONS request passes, and the subsequent POST request works.

Complete CORS request flow

Pre‑flight OPTIONS request

Request headers:

Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Origin: http://localhost:8090
Referer: http://localhost:8090/

Response headers:

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: *
Access-Control-Allow-Methods: *
Access-Control-Allow-Origin: http://localhost:8090
Cache-Control: no-cache, no-store, max-age=0, must-revalidate
Pragma: no-cache
Vary: Origin, Access-Control-Request-Method, Access-Control-Request-Headers

Status: 200

Actual POST request

Request headers (example):

Accept: application/json, text/plain, */*
Content-Type: application/json;charset=UTF-8
Origin: http://localhost:8090
Referer: http://localhost:8090/
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.142 Safari/537.36

{ "username": "admin", "password": "123456" }

Response headers include the same CORS headers as above, plus content‑type and caching headers.

Status: 200

Project source code

GitHub repository: https://github.com/macrozheng/mall