// 웹 서버 생성 예시const http =require('http');constPORT=3000;const server = http.createServer((req, res)=>{// requestListener 함수// writeHead()는 한 번만 호출되어야 하며 end() 호출되기 전에 호출되어야 함// 상태 코드와 응답 헤더를 클라이언트에 보냄
res.writeHead(200,{'Content-Type':'text/plain'});// 데이터가 로드되었음을 서버에 알림
res.end('Hello!');});
server.listen(PORT,()=>{
console.log(`Listening on port ${PORT}...`);});// 127.0.0.1 => localhost
1-1. createServer() 메서드
http.createServer([options][requestListener]);로 구성
http.createServer() 메서드는 server 객체를 생성함
server 객체는 EventEmitter를 기반으로 만들어졌음 (Observer 디자인 패턴)
// 웹 서버에서 JavaScript 객체 보내기const server = http.createServer((req, res)=>{// requestListener 함수
res.writeHead(200,{'Content-Type':'application/json'// Content-Type 부분 수정});// 데이터가 로드되었음을 서버에 알림
res.end(JSON.stringify({a:"a",b:"b"}));});
2. HTTP Routing
페이지마다 다른 컨텐츠를 보여줄 수 있도록 경로 분리하기
2-1. 라우팅 생성하기
라우팅 예시로 만들기
localhost/port/home 연결 시, JavaScript 객체 보여주기
localhost/port/about 연결 시, html 텍스트 보여주기
localhost/port/dlskd(이상한 경로) 연결 시, 404 에러 보여주기
분기 처리를 해주면 됨
// 웹 서버에 라우팅 적용하기const server = http.createServer((req, res)=>{// '/home' 접속 시if(req.url ==='/home'){
res.statusCode =200;
res.setHeader('Content-Type','application/json');// 또는 writeHead로 한 번에 처리가능// res.writeHead(200, {// 'Content-Type': 'text/plain'// });
res.end(JSON.stringify({a:"a",b:"b"}));// '/about' 접속 시 }elseif(req.url ==='/about'){
res.setHeader('Content-Type','text/html');
res.write('<html>');
res.write('<body>');
res.write('<h1>About Page</h1>');
res.write('</body>');
res.write('</html>');
res.end();// 그 외의 접속 시}else{
res.statusCode =404;
res.end();}});
3. POST 요청으로 데이터 추가하기
POST로 데이터 추가하기
3-1. 데이터 전달 - fetch
fetch() 메서드를 이용하여 request 보내기
// POST 요청으로 데이터 보내기fetch('http://localhost:3000/home',{method:'POST',body:JSON.stringify({c:"c"})});
3-2. 서버에서 처리
// 웹 서버if(req.method ==='POST'&& req.url ==='/home'){// (data)는 요청의 body 데이터를 받음 --> 해당 데이터는 buffer 형식
req.on('data',(data)=>{
console.log('data', data);// 출력// data <Buffer 7b 22 63 22 3a 22 ...>// buffer 데이터 문자열로 바꾸기const stringfiedData = data.toString();
console.log('stringfiedData', stringfiedData);// 출력// stringfiedData {"c":"c"}// 기존 데이터 객체 dataObject에 객체화한 요청 데이터 JSON.parse(stringfiedData)를 넣기
Object.assign(dataObject,JSON.parse(stringfiedData));})}else{...}
Object.assign([대상 객체], [출처 객체]) : 출처 객체의 모든 속성을 대상 객체에 붙여넣기(덮어씀)하고 대상 객체를 반환
