ETC

About Cors

Cors 에 관하여

Posted by Damin on June 22, 2021

SOP (Same Origin Policy)

다른 출처의 리소스를 사용하는 것에 제한하는 보안 방식

url 의 Protocol, Host, Port 를 통해 같은 출처인지 확인할 수 있다.

  • 셋 다 같아야 같은 출처. 하나라도 다르다면 다른 출처
1
2
http://localhost = http://localhost/api/cors
http://localhost != http://127.0.0.1
  • 웹 브라우저는 URL 을 String 으로 비교를 하므로, localhost 와 127.0.0.1 은 다르다고 인식한다.

CORS (Cross-Origin Resource Sharing)

다른 출처의 리소스를 사용하려면? CORS 를 이용해야 한다.

교차 출처 리소스 공유(CORS)는 추가 HTTP 헤더를 사용하여, 다른 출처의 선택한 자원에 접근할 수 있도록 권한을 브라우저에 알려주는 체제.

CORS 접근제어 시나리오

Simple Request

Preflight Request 없이 바로 요청을 날린다

다음 조건을 만족해야 한다

  • GET, POST, HEAD 메서드
  • Content-Type
    1. application/x-www-form-urlencoded
    2. multipart/form-data
    3. text/plain
  • Header Accept, Accept-Language, Content-Language, Content-Type 만 허용

Preflight Request

  1. OPTIONS 메서드를 통해 다른 도메인의 리소스에 접근이 가능한지 확인
  2. 요청이 가능하다는 Response 가 온다면 실제 요청을 보낸다
  3. 실질적으로 2번의 요청이 가는 상황이 이루어 진다
1
2
3
4
5
6
7
8
9
10
11
12
Preflight Request

- Origin : 요청 출처
- Access-Control-Request-Method : 실제 요청의 메서드
- Access-Control-Request-Headers : 실제 요청의 추가 헤더

Preflight Response

- Access-Control-Allow-Origin : 서버 측 허가 출처
- Access-Control-Allow-Methods : 서버 측 허가 메서드
- Access-Control-Allow-Headers : 서버 측 허가 헤더
- Access-Control-Max-Age : Preflight 응답 캐시 기간

Credentialed Request

인증 관련 헤더를 포함할 때 사용하는 요청이다

클라이언트측
  • credentials : include
서버측
  • Access-Control-Allow-Credentials : true (Access-Control-Allow-Origin : * 는 안된다)

Spring boot 에서 Cross Origin 설정하기

1
2
3
4
5
6
7
8
9
10
11
12
13
14
@Configuration
public class WebMvcConfig implements WebMvcConfigurer {

    private static final long MAX_AGE_SECS = 3600;

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("GET", "POST", "PUT", "PATCH", "DELETE", "OPTIONS")
                .allowedHeaders("*")
                .maxAge(MAX_AGE_SECS);
    }
}

Reference

나봄의 CORS