하나의 서버에서 react(front)-springboot(back) 간 요청 CORS

Question

안녕하세요. 제발 살려주세요 부탁드립니다ㅠㅠ (10시간 넘은 것 같아요...ㅠㅠㅠ)프론트 쪽은 React로, 백엔드 쪽은 Spring Boot를 이용해서,각각의 프로젝트(디렉토리)를 만들어서, Rest API로 요청을 주고 받았는데요 (로컬 - Windows에서)AWS EC2로 프리티어 인스턴스 하나를 발급 받아서, 이쪽에 배포를 했는데React는 npm start 또는, build 후에 serve -s build 로 3000번 포트에 웹이 띄워졌고Spring Boot는 4000번 포트로 띄워졌는데문제가, Spring 쪽에 CORS 관련 설정도 해놓아서, Windows에서는 요청을 잘 주고 받았었는데, &#64;Configuration public class CorsConfig implements WebMvcConfigurer { &#64;Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping(&#34;/**&#34;) .allowedMethods(&#34;*&#34;) .allowedHeaders(&#34;*&#34;) .allowedOrigins(&#34;*&#34;); } }EC2에서는 네트워크에서 CORS 관련 오류가 발생합니다..referrer policy: strict-origin-when-cross-origin추가로 궁금한 질문도 드려봅니다.원인이 무엇일까요...React 관련해서는 express, nginx 등 이야기가 많던데, (특별한 기법을 사용하지 않는다면) React 배포 서버와 Spring 배포 서버가 꼭 달라야하나요?(이건 포트폴리오 용이라, React는 그냥 npm start 로 development server(배포하기 전에 개발하던 것처럼)로 해도 되지 않을까 싶은데 맞을까요)serve -s build 명령어로 실행해도 원래대로라면 정상적으로 실행이 돼야하는게 맞는거죠? (해석을 잘못했나, 문서 설명에는 static 사이트를 제공하는 것처럼 얘기해서요..)

이초다 · Accepted Answer

front 쪽에서 바라보는 스프링부트 경로가 localhost로 되어 있는것 같은데용? ec2에 react를 배포할때 backend api 경로를 ec2에 배포된 스프링 부트 경로로 설정해보세요.

Clickin · Answer

프론트 초보 분들이 하시는 실수인데 이초다님이 잘 살명해주셨지만 이해를 돕기 위해 부가설명해봅니다.CSR, 즉 브라우저에서 실행된다는 의미는 프론트 서버에 가서 실행되는 게 아니라 프론트 서버는 정적 리소스를 제공해주기만 하고 실제 실행은 브라우저가 담당합니다.그러니 프론트에서 localhost는 사용자 pc가 되는거죠로컬에서는 잘 되는데 왜 배포하니까 안돼요? 하는것도로컬 개발에서는 진짜 로컬호스트에 백엔드 서버도 같이 있었으니까 문제가 없는 것처럼 보였던거죠

vrerv · Answer

spring-security 도 쓰시나요?아래 추가 설정이 필요한 건 아닌지 모르겠네요.// https://docs.spring.io/spring-security/site/docs/5.4.2/reference/html5/#cors @EnableWebSecurity public class WebSecurityConfig extends WebSecurityConfigurerAdapter { @Override protected void configure(final HttpSecurity http) throws Exception { // ... // if Spring MVC is on classpath and no CorsConfigurationSource is provided, // Spring Security will use CORS configuration provided to Spring MVC http.cors(Customizer.withDefaults()); } }

하나의 서버에서 react(front)-springboot(back) 간 요청 CORS

3개의 답변

Q&A 목록