CORS

 

 

CORS(Cross-origin resource sharing, 교차출처 리소스 공유) 는 한 줄로 말하면:

브라우저가
"다른 도메인 API 호출을 허용할지"
제어하는 보안 정책

 

이다.

---

가장 먼저 핵심

CORS는:

브라우저 보안 기능

 

이다.

즉:

서버 ↔ 서버 통신

 

에는 거의 적용 안 된다.

---

왜 생겼냐?

브라우저는 기본적으로:

다른 사이트 데이터 읽기 제한

 

한다.

이걸:

Same-origin policy

라고 한다.

Same-Origin Policy(SOP)

브라우저 규칙:

현재 사이트와 다른 Origin 요청 결과는
기본적으로 JS가 읽지 못함

 

Origin이란?

다음 3개 조합.

요소	예
프로토콜	https
도메인	example.com
포트	443

즉 아래는 전부 다른 Origin

URL	차이
https://example.com http://example.com ftp://example.com mailto://example.com	프로토콜 다름
https://api.example.com https://blog.example.com https://admin.example.com https://m.example.com	서브도메인 다름
https://example.com:8080	포트 다름 http 80 https 443

---

예시 상황

Frontend:

https://frontend.com

 

JS가 API 호출

fetch("https://api.com/users")

 

브라우저 입장

"다른 Origin인데?"

 

판단.

기본은 차단

즉 응답이 와도:

JS가 읽지 못하게 막음

 

왜 이렇게 막냐?

엄청 중요.

만약 제한 없으면:

악성 사이트가
은행 사이트 데이터 읽기 가능

 

해질 수 있다.

즉 SOP 목적(Same-Origin Policy)

다른 사이트 데이터 보호

 

그런데 현실은 Cross-Origin 필요

현대 웹은 보통:

역할	도메인
Frontend	app.com
API	api.com

frontend, api 분리 많다.

그래서 등장

CORS (Cross-Origin Resource Sharing 교차출처 리소스 공유)

 

 

---

핵심 아이디어

서버가 브라우저에게:

"이 Origin은 허용"

 

이라고 알려준다.

실제 헤더

 

Access-Control-Allow-Origin:
https://frontend.com

 

의미

frontend.com JS는
응답 읽기 허용

 

---

흐름

1. 브라우저 요청

Origin: https://frontend.com

 

헤더 포함.

2. 서버 응답

Access-Control-Allow-Origin:
https://frontend.com

 

3. 브라우저 검사

허용된 Origin이면:

JS 접근 허용

 

아니면?

CORS 에러

 

발생.

---

중요 — 서버는 실제 응답함

헷갈리는 부분. 

CORS는 브라우저가 응답 읽기를 차단하는 것.

즉 서버는 응답 보냈을 수 있음.

 

Preflight 요청

브라우저가 위험 요청 전에

먼저:

OPTIONS

 

요청 보냄.

이걸 Preflight 라고 함.

"이 요청 허용 가능한가?" 를 미리 확인

 

예시

OPTIONS /users

Origin: https://frontend.com
Access-Control-Request-Method: PUT

 

서버 응답

Access-Control-Allow-Methods:
GET,POST,PUT

 

허용 시 실제 요청 진행.

---

Credentials 문제

쿠키 포함 요청

fetch(url, {
  credentials: "include"
})

 

이 경우 서버는 반드시:

Access-Control-Allow-Credentials:
true

 

필요.

그리고 주의

이 경우:

Access-Control-Allow-Origin: *

 

사용 불가.

반드시 명시 Origin 필요.

---

Spring Boot 설정

전역 설정 예시

@Configuration
public class CorsConfig {

  @Bean
  public WebMvcConfigurer corsConfigurer() {
    return new WebMvcConfigurer() {
      @Override
      public void addCorsMappings(
          CorsRegistry registry) {

        registry.addMapping("/**")
          .allowedOrigins(
            "https://frontend.com")
          .allowedMethods("*")
          .allowCredentials(true);
      }
    };
  }
}

 

옵션 설명

옵션	의미
allowedOrigins	허용 Origin
allowedMethods	허용 HTTP 메서드
allowCredentials	쿠키 허용

---

절대 주의할 것

운영에서:

.allowedOrigins("*")

 

남발 위험.

특히 Credentials=true와 조합 위험.

---

Postman은 왜 CORS 안 걸리냐?

 

이유

CORS는:

브라우저 정책

 

이다.

Postman/서버통신은

브라우저 아니므로 제한 없음.

---

CORS vs CSRF 차이

 

CORS

다른 Origin 응답 읽기 제한

 

CSRF

브라우저 자동 쿠키 전송 악용

 

---

핵심 한 줄

CORS는:

브라우저가 다른 Origin(도메인/포트/프로토콜)의 API 응답을
JavaScript에서 읽을 수 있을지 서버 정책에 따라 제어하는 보안 메커니즘

 

이다.