Nodejs(express) 통신 CORS, CORS Pre-Flight 설정하기

2018-02-25

Explanation

CORS, Preflight에 관한 설명은 얕은 지식으로 적는것보단 참고된 링크를 확인하는게 좋을 것 같습니다.
참고링크 : developer.mozilla.org – Access_control_CORS

간단하게..
* CORS: CORS는 Cross-Origin Resource Sharing, 다른 도메인의 호출을 승인하거나 차단하는 것을 결정합니다. 대체적으로 기본값은 다른 도메인 혹은 다른 포트 혹은 서브 도메인 모두 허용되지 않습니다.
* Preflight: 요즘은 JSON 타입으로 통신을 하는 경우가 많습니다. 하지만 예를 들어 POST 메서드로 콘텐츠 타입 Application/json으로 통신하는 것은 표준이 아닙니다. 그렇기 때문에 브라우저는 OPTION 이라는 메서드로 서버로 사전 전달을 하여 승인을 받은 후 실제 데이터를 전송합니다.

(대략.. CORS나 preflight 설정을 해주지 않으면 아래와 비슷한 오류가 출력됩니다.)

Failed to load http://localhost:1111/test: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:2222’ is therefore not allowed access.

그리고 이 글은 간단하게 CORS와 Preflight에 관한 설정에 대한 예를 적어보려 합니다.
(혹시나.. 이 글의 취지는 CORS, Preflight 설정을 모두 허용해주어야 한다는 것이 아닌.. 대략 이런식으로 설정을 해줘야 한다 입니다.)

// express, body-parser, cors 모듈은 설치해줘야 합니다.

const express = require('express');

const bodyParser = require('body-parser');

const app = express();

app.use(bodyParser.json());

// body로 온 json의 데이터를 오브젝트 형태로 읽을 수 있게 합니다.

const cors = require('cors');

// cors 모듈을 가져와서

const corsOpt = function(req, callbank) {

callbank(null, {origin: true});

};

// 모든 도메인의 통신을 허용합니다.

app.options('*', cors(corsOpt));

// 모든 options 메서드로의 사전 전달 접근을 허용합니다.

app.post('/test', cors(corsOpt), function (req, res) {

res.send({test: 'ok'});

});

app.listen(1111, function () {

console.log('Example app listening on port 1111!');

});

참고링크1. Github – nilcolor
참고링크2. Github – expressjs