CORS (Cross-Origin Resource Sharing)

CORS error (Cross-Origin Resource Sharing)

웹개발을 하다보면 무조건 겪게 된다는 CORS 에러는 CORS 정책을 위반하면 발생한다. 이걸 왜 정책으로 만들어서 귀찮게 한다고 생각할 수 있겠지만, 어떻게 보면 CORS 정책 덕분에 보안성이 어느정도는 지켜지기 때문에 필수적이라고 할 수 있다.

CORS 에러는 동일 출처에서 요청이 아닐경우 발생한다. Same-Origin을 갖고 있다면 문제가 없겠지만 서로 다른 곳에서 오는 요청은 브라우저가 알아서 차단하게 된다. (기본기능)

CORS 가 동작하는 방법

브라우저는 스크립트를 활용한 요청의 origin을 확인한다. (도메인, 호스트, 포로토콜, 포트의 동일여부 등)
이때 응답받은 서버는 헤더를 전송하게 되는데 여기에 Access-Control_Allow_Origin이라는 값을 넣어서 보낼 수 있다. 이는 특정 Origin은 허용한다라는 정보를 담고 있다.

CORS를 해결하기 위한 방법

사실 Node.js환경에서 CORS에러의 해결법은 간단하다. CORS라이브러리를 이용하는 것인데 사용법은 아래 간단히 정리하려고 한다.

1. 먼저 cors 라이브러리를 설치한다.

npm i cors

2. 먼저 cors 라이브러리를 설치한다.

//cors import 해주고
import cors from "cors";

// 허가하고 싶은 도메인을 입력.
const corsOptions = {
  origin: "domainURL",
  optionsSuccessStatus: 200,
};

// cors()의 매개변수로 corsOptions 사용.
// 만약 빈칸으로 둘 경우 모든 요청에 대해서 허가.
app.use(cors(corsOptions));