이번주는 클라이언트와 서버를 구현하는것에 대해서 간단한 실습을 통해 배웠다.
처음으로 접한거라 그런지 많이 어려웠고, 그래도 하고나니 대충 서버와 클라이언트 사이에서
어떤식으로 데이터가 오고가는지를 알게되었다!
코드를 짤때 서버에 계속 연결을 해줬다가 오류가나면 다시 또 코드를 쳐서 연결을 해줘야하는데 이런 번거로움을 없애기 위해서 nodemon을 사용한다.
$ npm install -g --save nodemon
나의 경우, 처음에 설치했을때 nodemon을 찾을 수 없다는 오류가 계속 떠서 확인해보니 -g를 붙여서 설치를 해줘야 한다고한다.
-g는 글로벌 설치를 한다는 뜻이며, 현재 프로젝트의 library가 아니라 시스템에 설치하는것이므로 --global옶션을 사용해줘야 한다고 한다.
--save를 붙여주는 가장 큰 이유로는 save를 하지않으면 협업시에 문제가 된다고 한다. 그러니 꼭 붙여서 설치해주는 습관을 기르도록 해야겠다.
HTTP에는 상태코드들이 있는데 몇가지는 외우는게 좋다.
100 - 109 : 메시지 정보
200 - 206 : 요청 성공
300 - 305 : 리 다이렉션
400 - 415 : 클라이언트 에러
500 - 505 : 서버 에러
굵게 표시한거는 꼭 알고있자.
이번에 진행한 mininode server 스프린트이다. 버튼 클릭시 각각 다른 요청을 보내고, 각각 보낸 단어를 소문자나 대문자로 변환시켜서 응답처리를 하는거다.
참조할 사이트가 있어서 꾸역꾸역 완성하긴했다...
HTTP트랜잭션 해부
const server = http.createServer((request, response) => { if(request.method === 'OPTIONS') { response.writeHead(200, defaultCorsHeader) response.end() } if(request.method === 'POST') { let body = [] request.on('data', (chunk) => { body.push(chunk) }).on('end', () => { response.writeHead(200, defaultCorsHeader) body = Buffer.concat(body).toString() if(request.url === '/lower') { response.end(body.toLowerCase()) } else if(request.url === '/upper') { response.end(body.toUpperCase()) } }) } else { response.writeHead(404, defaultCorsHeader) response.end() } }); server.listen(PORT, ip, () => { console.log(`http server listen on ${ip}:${PORT}`); }); const defaultCorsHeader = { 'Access-Control-Allow-Origin': '*', 'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS', 'Access-Control-Allow-Headers': 'Content-Type, Accept', 'Access-Control-Max-Age': 10 };
OPTIONS 메소드??
주석처리로 cors라고 써놓았는데, cors는 cross-origin resource sharing의 약자이다.
용어 그대로 한쪽에서 실행중인 웹애플리케이션이 다른 쪽의 자원에 접근할 수 있는 권한을
부여하도록 브라우저에서 알려주는 거라고 보면된다.접근제어 시나리오
- simple request
- preflighted request(OPTIONS 메소드사용)
- request with credentials : 인증정보를 포함한 요청
단순요청의 경우 cors는 신경을 안쓰는 반면에, preflighted request는
메소드를 주어서 사전에 미리 확인하여, 서버가 이 요청을 받을지(허용하는지 아닌지)
아니면 거절할지를 판단하는 과정이라고 보면 된다.
CORS관련해서는 모질라에서 아주 설명이 잘되어있다.
중요한 개념이니 꼭 다시한번 짚고 넘어가야겠다.
https://developer.mozilla.org/ko/docs/Web/HTTP/CORS
후... 처음으로 구현해본 서버였다. 간단한 스프린트였다고하나, 익숙하지가 않아 엄청 헤맸었다. 다시한번 풀어보면서 부족한 개념과 서버와 클라이언트간에 데이터를 어떻게 주고받는지 복습해야겠다..! ㅠ_