CORS란?

CORS는 서로 다른 Origin 에서 리소스를 공유할 수 있도록 하기 위한 정책이다.

예를들어 도메인 또는 포트가 다르다면 보안을 위해 SOP(Same-Origin-Policy) 라는 정책에 의해 요청이 제한된다.

하지만 SPA가 대세가 되면서 서버와 클라이언트의 도메인을 따로 두는 경우가 많아졌고 이 때 발생하는 SOP에 의한 제한을 CORS 설정을 통해 해결할 수 있다.

koa 에서 CORS 적용

koa 서버에서는 koa/cors 라는 모듈을 사용하여 손쉽게 cors 정책을 설정할 수 있다.

예를들어 아래와 같이 허용해줄 origin을 설정하면 된다.

app.use(
    cors({
      origin: 'xxx.xxx.xxx.xxx:5000',
      credentials: true,
    }),
  );

origin 포트 설정

로컬에서 테스트를 위해 돌렸을 때는 origin에 http://localhost:3000 와 같이 적어주면 정상적으로 cors 정책 설정이 작동하였다.

하지만 nginx 서버에 배포를 한 이후에는 cors 오류가 계속 발생하였는데, 그 이유는 80번 포트를 쓰고 있기 때문이었다.

koa의 cors 설정에서는 포트가 80번(http) 혹은 443번(https)이 아닌 경우에만 origin의 포트를 명시해줘야 하고 80번(http) 또는 443번(https) 포트를 사용한다면 포트를 명시하지 말아야 한다.