CORS

CORS(Cross Origin Resource Sharing)는 도메인/포트가 다른 서버의 자원을 요청하는 메커니즘이다. 일반적인 환경에서는 동일 출처 정책(same-origin policy)때문에 CORS 상황이 발생하면 브라우저에서 데이터 요청을 보안 목적으로 차단한다.

동일 출처 정책(same-origin policy)은 어떤 출처에서 불러온 문서나 스크립트가 다른 출처에서 가져온 리소스와 상호작용하는 것을 제한하는 중요한 보안 방식입니다. 동일 출처 정책은 잠재적으로 해로울 수 있는 문서를 분리함으로써 공격받을 수 있는 경로를 줄여줍니다. - MDN Web Docs

노드에서 해결하기

노드 서버 환경에서는 CORS 미들웨어를 사용하여 간단하게 CORS를 조정할 수 있다.

먼저 cors npm을 설치한다.

1
$ yarn add cors # npm install cors --save

이제 express의 미들웨어로 cors를 등록하면 된다.

1
2
3
4
5
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors()); // CORS Middleware 추가

위와 같이 CORS 미들웨어를 적용하면 모든 Cross Domain 요청에 대해 허가하게 된다. 로컬 테스트 환경이라면 괜찮겠지만, 배포 환경에서는 보안적으로 취약해지게 된다.

그러면 CORS 요청에 대한 허가 도메인을 정해주고, 그 옵션으로 cors를 추가하면 된다.

1
2
3
4
5
6
const corsOption = {
origin: 'https://zini.run', // 허가 도메인
credentials: true,
};

app.use(cors(corsOption));

크로스 도메인에 대한 정보만 적절하게 조정한다면 CORS 보안 문제는 일어나지 않을 것이다.