생활기록부

Spring Boot Postman은 되는데 브라우저는 CORS 오류? 원인과 해결 방법Spring Boot API를 개발하다 보면 이상한 상황을 만날 수 있습니다.Postman에서는 API가 정상적으로 호출됩니다.POST /api/orders200 OK그런데 React나 Vue에서 같은 API를 호출하면 브라우저에서 다음과 같은 오류가 발생합니다.Access to fetch at 'http://localhost:8080/api/orders'from origin 'http://localhost:3000'has been blocked by CORS policy또는:No 'Access-Control-Allow-Origin' header is presenton the requested resource.이런 상..

CORS Preflight란? OPTIONS 요청이 발생하는 이유와 실패 해결 방법Spring Boot와 React, Vue 같은 Front-end를 연동하다 보면 Network 탭에서 다음과 같은 요청을 볼 수 있습니다.OPTIONS /api/orders직접 작성한 적도 없는데 브라우저가 갑자기 OPTIONS 요청을 보내는 것을 보고 당황할 수 있습니다.그리고 이 요청이 실패하면 실제 API 요청은 아예 실행되지 않을 수 있습니다.브라우저 Console에는 다음과 같은 메시지가 나타날 수 있습니다.Access to fetch at 'http://localhost:8080/api/orders'from origin 'http://localhost:3000'has been blocked by CORS pol..

Spring Security CORS 오류 해결 - SecurityFilterChain 설정 방법Spring Boot에서 CORS 설정을 했는데도 브라우저에서 계속 다음과 같은 오류가 발생하는 경우가 있습니다.Access to fetch at 'http://localhost:8080/api/users'from origin 'http://localhost:3000'has been blocked by CORS policy또는:No 'Access-Control-Allow-Origin' header is presenton the requested resource.분명 WebMvcConfigurer에서 CORS 설정을 추가했는데도 오류가 계속된다면 Spring Security가 요청을 먼저 막고 있는지 확인할 필..

Spring Boot 전역 CORS 설정 방법 - WebMvcConfigurer로 한 번에 적용하기Spring Boot에서 React, Vue 같은 Front-end와 REST API를 연동하다 보면 CORS 오류를 만나는 경우가 있습니다.대표적으로 브라우저에서 다음과 같은 메시지가 나타납니다.Access to XMLHttpRequest at 'http://localhost:8080/api/users'from origin 'http://localhost:3000'has been blocked by CORS policy또는:No 'Access-Control-Allow-Origin' header is presenton the requested resource.간단한 프로젝트라면 Controller에 @Cro..