[node] CORS란? CORS 문제 해결하기

로컬에서 프런트 서버와 백엔드 서버의 포트를 다르게 사용할 때 발생하는 문제인 CORS 해결방법에 대해 정리합니다.

 

1. CORS

 

  CORS는 Cross Origin Resource Sharing의 약자로 도메인 및 포트가 다른 서버로 클라이언트가 요청했을 때 브라우저가 보안상의 이유로 API를 차단하는 문제입니다.  예로 들면 로컬에서 클라이언트는 3000 포트로 서버는 10000 포트로 서버를 띄웠을때 또는 로컬 서버에서 다른 서버로 호출할 때 발생하게 됩니다.

 

2. 해결 방법

 

 node 서버에서 cors 이슈를 해결하는 몇가지 방법을 정리합니다.

 

1. Access-Control-Allow-Origin response 헤더를 추가.

app.get('/', (req,res) => {
  res.header("Access-Control-Allow-Origin", "*");
  ...
}

 

어떤 특정 요청에만 적용 하고 싶다면 cross-origin을 허락하는 헤더를 추가해 문제를 해결할 수 있습니다.

 

2. 미들웨어 CORS 추가.

미들웨어 cors를 활용하여 해결 할 수 있습니다.

npm install cors

 

cors를 설치 한 다음 app.js에 다음을 추가해줍니다.

const cors = require('cors');

app.use(cors());

 

만약, 특정 URL만 허용하고 싶다면 다음과 같이 options을 추가해줍니다.

const cors = require('cors');
const corsOptions = {
  origin: "http://localhost:3000",
  credentials: true
}
app.use(cors(corsOptions));

 

함수 형태로도 가능합니다.

const cors = require('cors');
const domains = ['http://localhost:3000'];

const corsOptions = {
  origin: function(origin, callback){
  	const isTrue = domains.indexOf(origin) !== -1;
    callback(null, isTrue);
  }
  ,
  credentials: true
}
app.use(cors(corsOptions));