How to Fix CORS error with ngrok in SpringBoot

Introduction

Tried to access spring boot server using ngrok url but getting CORS error. the allow origin has already the url from which i am trying to access the apis. but still no good.

Any suggestion is appreciated.

Spring Boot Project -

POM

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.7.1</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.example</groupId>
    <artifactId>crostest003</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>crostest003</name>
    <description>crostest003</description>
    <properties>
        <java.version>11</java.version>
        <kotlin.version>1.6.21</kotlin.version>
    </properties>
    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-security</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-webflux</artifactId>
        </dependency>
        <dependency>
            <groupId>com.fasterxml.jackson.module</groupId>
            <artifactId>jackson-module-kotlin</artifactId>
        </dependency>
        <dependency>
            <groupId>io.projectreactor.kotlin</groupId>
            <artifactId>reactor-kotlin-extensions</artifactId>
        </dependency>
        <dependency>
            <groupId>org.jetbrains.kotlin</groupId>
            <artifactId>kotlin-reflect</artifactId>
        </dependency>
        <dependency>
            <groupId>org.jetbrains.kotlin</groupId>
            <artifactId>kotlin-stdlib-jdk8</artifactId>
        </dependency>
        <dependency>
            <groupId>org.jetbrains.kotlinx</groupId>
            <artifactId>kotlinx-coroutines-reactor</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>io.projectreactor</groupId>
            <artifactId>reactor-test</artifactId>
            <scope>test</scope>
        </dependency>
        <dependency>
            <groupId>org.springframework.security</groupId>
            <artifactId>spring-security-test</artifactId>
            <scope>test</scope>
        </dependency>
    </dependencies>

    <build>
        <sourceDirectory>${project.basedir}/src/main/kotlin</sourceDirectory>
        <testSourceDirectory>${project.basedir}/src/test/kotlin</testSourceDirectory>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
            <plugin>
                <groupId>org.jetbrains.kotlin</groupId>
                <artifactId>kotlin-maven-plugin</artifactId>
                <configuration>
                    <args>
                        <arg>-Xjsr305=strict</arg>
                    </args>
                    <compilerPlugins>
                        <plugin>spring</plugin>
                    </compilerPlugins>
                </configuration>
                <dependencies>
                    <dependency>
                        <groupId>org.jetbrains.kotlin</groupId>
                        <artifactId>kotlin-maven-allopen</artifactId>
                        <version>${kotlin.version}</version>
                    </dependency>
                </dependencies>
            </plugin>
        </plugins>
    </build>

</project>

application.properties

server.port=9005
#security
spring.security.user.name=service
spring.security.user.password=password

Controller

@RestController
@RequestMapping("/")
class ControllerOne {

    @GetMapping
    fun getOne(): GenericResponse {
        return GenericResponse(message = UUID.randomUUID().toString())
    }
}

data class GenericResponse(
    var message: String = "",
) : Serializable

AppSecurityConfig

import org.springframework.context.annotation.Bean
import org.springframework.security.config.annotation.web.reactive.EnableWebFluxSecurity
import org.springframework.security.config.web.server.ServerHttpSecurity
import org.springframework.security.web.server.SecurityWebFilterChain
import org.springframework.web.cors.CorsConfiguration

@EnableWebFluxSecurity
class AppSecurityConfig {

    @Bean
    fun securityWebFilterChain(http: ServerHttpSecurity): SecurityWebFilterChain {
        return http
            .cors()
            .configurationSource { _ ->
                val cors = CorsConfiguration()
                cors.allowedOrigins =
                    listOf("https://stackoverflow.com")
                cors.allowedMethods = listOf("*")
                cors.allowedHeaders = listOf("*")
                cors.allowCredentials = true
                cors
            }
            .and()
            .csrf().disable()
            .build()
    }
}

Made a ngrok url -

ngrok http --host-header=rewrite 9005

Now i want to test this from chrome - I went to stackoverflow inspect and made a fetch request.

fetch('ngrokUrl',{headers:{'Access-Control-Allowed-Origin':'https://stackoverflow.com'}}).then(console.log);

Error i got -

How do i fix this ?

The project a very basic and i barely made any changes but still there is a cors issue.

Took reference from - baeldung

Demo Project Link - Github

Update

Tried changing the ngrok version to past (2.3.40) version. but still no good.

Strangely only POST request are working. but GET requst is giving a cors error.

Major Update >>>> 29-6-2022

Everything working in widows 10 and this error is only there in windows 11.