invalid host header

ngrok을 실행하고 해당 도메인으로 들어갔지만

invalid host header 이라는 오류 문구가 뜬다

react 서버 파일에서

\node_modules\react-scripts\config\webpackDevServer.config.js

을 찾아 들어간다.

module.exports = function (proxy, allowedHost) {
  const disableFirewall = 
    !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true';
  return {

를

module.exports = function (proxy, allowedHost) {
  const disableFirewall = true
    !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true';
  return {

const disableFirewall = true

이부분을 true로 바꿔주면 해결된다.

---

서버 요청 불가 (CORS)

Spring 서버 파일

• WebConfig.java

// CORS를 허용해서 React 서버와 데이터를 주고 받을 수 있게 해주는 코드
@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOriginPatterns("*")
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .allowedHeaders("*")
                .allowCredentials(true);
    }

    @Bean
    public CorsFilter corsFilter() {
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        config.addAllowedOriginPattern("*"); // 모든 출처 허용
        config.addAllowedHeader("*"); // 모든 헤더 허용
        config.addAllowedMethod("*"); // 모든 메소드 허용
        source.registerCorsConfiguration("/**", config);
        return new CorsFilter(source);
    }
}

어떤 도메인에서도 요청 가능하게 바꿨다.