Nodejs 서버의 Ajax 요청시 CORS 정책 지정 방법 및 OPTIONS 오류 문제 해결

기본적으로 CORS 는 외부 사이트에 대한 요청을 허가할 것인지 거부할 것인지에 대한 규격이라고 보면 된다.

예를 들어 사이트 A가 있고, 사이트 B가 있다고 가정한다. B는 실제 백 엔드로, API 나 어떤 실질적인 데이터를 RestAPI 등으로 제공하는 서비스라고 볼 수 있다.

이 때 A 는 Ajax 등의 동적 요청을 통해 B 사이트 주소에 요청할 수 있지만, 기본적인 정책에서는 B에 엑세스할 수 없다. 바로 브라우저의 CORS 정책 때문이다.

이는 기본적으로 A 사이트 스크립트에 포함된 악성 코드가 B 사이트로 무단으로 데이터를 반출하는 것을 방지하는데 목적이 있다.

즉 A 에서 가져온 쿠키 정보 기타 데이터 등을 B에 전송하는 걸 방지하기 위해 B의 엑세스가 거부된다.

하지만 B가 허용해야 할 대상 서버인 경우는 CORS 정책을 허용해야 한다.

기본적으로 서버가 CORS 정책을 클라이언트에게 알리기 위해 헤더에 담아서 전송하면 된다. Credentials 는 쿠키 처리를 허용하는지에 대한 여부이다. 즉 안에서 세션을 관리하는 경우 true해주면 된다.

Origin 에는 허가할 출처 사이트 메인 주소를 입력하면 된다. 만약 A -> B 접근에서 B가 A를 허용하려는 경우, B 서버에서는 A의 사이트 주소를 Origin 으로 허가하면 된다.

사이트 A에서 B에 접속하기 전 접속이 허가되는지 등의 정보를 요청하기 위해 GET, POST 가 아닌 OPTIONS 메서드로 요청을 보낸다. 그렇기 때문에 OPTIONS 접속도 허용해야 한다. 여기서 끝이 아니다. Options 요청도 허가 해야 한다.

이외 기본 인증 요청, 페이지 요청에 대한 엑세스를 허가한다.

그런데 위 헤더만 지정한 뒤 시도하여도 여전히 CORS 오류가 뜬다. 엑세스를 해서 CORS 정보를 불러올 수 없다는 식으로 오류가 뜬다. 이는 Options 로 조회하는 과정에서, Options 응답이 없기 때문이다. 보통 NodeJS 로 라우팅을 하면 GET, POST 만 라우팅하는데, Options 에 대해서도 라우팅을 하여 위 헤더 정보와 함께 성공 여부를 전송해야 한다.

즉 OPTIONS 요청이 발생한 경우 res sendStatus 를 통해 200 상태 정보를 보내어 해당 요청을 끝내야 한다. 그리고 A 클라이언트쪽에서는 해당 허가 정보를 읽고 허가된 경우 다시 GET 등의 요청을 보낼 것이다.