CORS 란 ?

CORS (Cross-Origin Resource Sharing) 는 브라우저가 보안을 위해 다른 출처의 요청을 막는 기능 이다.

서버가 허락한 경우에는 요청을 허용해준다.

 

다른 출처란?

출처는 프로토콜 + 도메인 + 포트번호 로 구성된다.

예를 들어 

  http://localhost:3000 [ 프론트 ]

  http://localhost:5000 [ 백엔드 ]

포트가 다르기 때문에 출처가 다르다 - CORS 발생

 

CORS 에러는 왜 생길까?

• 브라우저는 다른 출처로 요청할 때 보안상의 이유로 막는다.
• 이때 서버가 "이 프론트 주소는 허용" 라고 응답해야 요청이 정상적으로 처리된다.

 

해결 방법 (서버에서)

Node.js(Express)에서의 설정

const cors = require('cors');
app.use(cors({
    origin: 'http://localhost:3000', // 허용할 프론트 주소
    methods: ['GET','POST','PATCH'], // 허용할 HTTP 메서드
    credentials: true	             // 쿠키 등 자격 정보 허용 여부
}));