💛 네트워크 - CORS란 무엇이고 어떻게 구현할 수 있나요?

2) 네트워크 - CORS란 무엇이고 어떻게 구현할 수 있나요?

• 웹 애플리케이션을 개발할 때, 다른 도메인에서 리소스를 요청해야 하는 상황이 자주 발생한다. 하지만 보안상의 이유로 이러한 요청이 기본적으로 차단될 수 있다. 이를 해결하기 위한 방법이 바로 CORS(Cross-Origin Resource Sharing)

• CORS란?

  • CORS는 웹 애플리케이션이 한 도메인에서 실행될 때 다른 도메인에 있는 리소스에 접근할 수 있도록 허용하는 메커니즘이다. 기본적으로 웹 브라우저는 보안상의 이유로 다른 도메인에서의 요청을 제한한다. 이는 동일 출처 정책(Same-Origin Policy)이라고 하며, 악의적인 공격으로부터 사용자를 보호하기 위한 중요한 보안 조치이다.

• CORS의 작동원리

  • CORS는 HTTP 헤더를 사용하여 브라우저와 서버 간의 교류를 제어한다.

    • 1. Preflight 요청 : 클라이언트가 서버에 요청을 보내기 전에, 브라우저는 먼저 OPTIONS 메서드를 사용하여 프리플라이트 요청을 보낸다.
    • 1. 서버 응답 : 서버는 프리플라이트 요청에 응답하여, 실제 요청이 허용되는지 여부를 브라우저에 알려준다. 이때 서버는 Access-Control-Allow-Origin, Access-Control-Allow-Methods, Access-Control-Allow-Header 등의 헤더를 포함하여 응답한다.
    • 1. 실제 요청 : 프리플라이트 요청이 성공하면, 브라우저는 실제 요청을 서버에 보낸다. 서버는 요청을 처리하고 응답을 반환한다.

• 위와 같은 과정을 통해 브라우저는 안전하게 다른 도메인에 있는 리소스에 접근할 수 있다.

• CORS 구현 방법

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotatio.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public calss WebConfig implements WebMvcConfigurer {
	
	@Override
	public void addCorsMappings(CorsRegistry registry) {
		registry.addMapping("/**")
				.allowedOrigins("http://localhost:3000")
				.allowedMethods("GET", "POST", "PUT", "PATCH", "DELETE", "OPTIONS");
		}
}