[생활코딩] Node.js 강의 8일차

Node.js - 모듈의 형식 & App 제작 - 모듈의 활용

 모듈 : 정리된 객체를 다시 정돈하는 도구
 

javascript에서 모듈은 export , import 문에 의존 (https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Modules)
 node.js에서 모듈은  export , require 문에 의존 (https://nodejs.org/api/modules.html)

아래와 같이 export

// nodejs/mpart.js
var M = {
    v:'v',
    f:function(){
        console.log(this.v);
    }
}

module.exports = M;

아래와 같이 require해서 가져다 쓰면 된다. 

// nodejs/muse.js

var part = require('./mpart.js');
part.f();

위에서 배운 모듈을 활용해서 main.js 코드를 정리해줬다.  새로 만들 모듈을 넣어줄 폴더 lib를 만들고 template.js 파일을 만들어 저번 시간에 객체로 정리해줬다.
web2/lib/template.js > template 객체를 붙여넣어주고 마지막줄에 module.exports = template; 을 추가해준다.

web2/main.js >  template 객체가 있던 자리에 var template = require('./lib/template.js'); 을 써준다.

 

App - 입력 정보에 대한 보안

사용자가 입력한대로 우리 데이터를 보려주지 않기 위해 path 모듈을 사용해 본다.
path.parse('파일명').base;를 이용하면 경로를 탐색해 내갈 수 있는 정보를 세탁할 수 있다.
사용자로부터 경로가 들어오는 모든 곳에 경로가 들어오는 모든 곳의 코드를 변경해줘야한다.
readFile이 있는 쪽의 코드를 아래와 같이 바꿔준다. 
web2/main.js > var filteredID = path.parse(queryData.id).base;
                            fs.readFile(`data/${filteredID}`,'utf8', 함수생략);

delete_process 부분도 아래와 같이 바꿔준다.

web2/main.js > var filteredID = path.parse(id).base; 

                              fs.unlink(`data/${filteredID}`,  함수생략 );                      

 

 

강의코드

// 경로 : web2/main.js

var http = require('http');
var fs = require('fs');
var url = require('url');
var qs = require('querystring');
var template = require('./lib/template.js');
var path = require('path');

var app = http.createServer(function(request,response){
    var _url = request.url;
    var queryData = url.parse(_url,true).query;
    var pathname = url.parse(_url,true).pathname;
    
    if(pathname ==='/'){
      if(queryData.id === undefined){
        fs.readdir('./data',function(error,filelist){
          var title = 'Welcome';
          var description  = 'Hello Node.js'
          var list = template.list(filelist);
          var html = template.html(title,list,`<h2>${title}</h2>${description}`,
          `<a href ="/create">create</a>`);
          response.writeHead(200);
          response.end(html);
        })
      }else{
        fs.readdir('./data',function(error,filelist){
          var filteredID = path.parse(queryData.id).base;
          fs.readFile(`data/${filteredID}`,'utf8',function(err,description){
            var title = queryData.id;
            var list = template.list(filelist);
            var html= template.html(title,list,`<h2>${title}</h2>${description}`,
            `<a href ="/create">create</a>
            <a href="update?id=${title}">update</a>
            <form action="/delete_process" method="post" >
              <input type="hidden" name ="id"  value="${title}">
              <input type="submit" value="delete">
            </form>`);
            response.writeHead(200);
            response.end(html);
          });
        });
      }
    } else if(pathname==='/create'){
        fs.readdir('./data',function(error,filelist){
          var title = 'Web - create';
          var list = template.list(filelist);
          var html = template.html(title,list,`
          <form action="/create_process" method="post">
          <p><input type="text" name="title" placeholder="text"></p>
          <p>
            <textarea name="description" placeholder="description"></textarea>
          </p>
          <p>
            <input type="submit">
          </p>
        </form>
          `,'');
          response.writeHead(200);
          response.end(html);
        });
    }else if(pathname==='/create_process'){
      var body = '';
      request.on('data',function(data){
          body = body + data;
      });
      request.on('end',function(){
        var post = qs.parse(body);
        var title = post.title;
        var description = post.description;
        fs.writeFile(`data/${title}`,description,'utf8',
        function(err){
          response.writeHead(302,{Location:`/?id=${title}`});
          response.end();
        })
      });
      
    }else if(pathname==='/update'){
      fs.readdir('./data',function(error,filelist){
        var filteredID = path.parse(queryData.id).base;
        fs.readFile(`data/${filteredID}`,'utf8',function(err,description){
          var title = queryData.id;
          var list = template.list(filelist);
          var html= template.html(title,list,
            ` 
            <form action="/update_process" method="post">
            <input type="hidden" name="id" value="${title}">
            <p><input type="text" name="title" placeholder="text" value ="${title}"></p>
            <p>
              <textarea name="description" placeholder="description">${description}</textarea>
            </p>
            <p>
              <input type="submit">
            </p>
          </form>
          `
          ,
          `<a href ="/create">create</a> <a href="update?id=${title}">update</a>`);
          response.writeHead(200);
          response.end(html);
        });
      });
    }else if(pathname==='/update_process'){
      var body = '';
      request.on('data',function(data){
          body = body + data;
      });
      request.on('end',function(){
        var post = qs.parse(body);
        var id = post.id;
        var title = post.title;
        var description = post.description;
        console.log(post);
        //파일 이름 바꾸기
        fs.rename(`data/${id}`,`data/${title}`,function(error){
          //바뀐 내용 버꾸기
          fs.writeFile(`data/${title}`,description,'utf8',
          function(err){
            response.writeHead(302,{Location:`/?id=${title}`});
            response.end();
          })
        })
      });
    }else if(pathname==='/delete_process'){
      var body = '';
      request.on('data',function(data){
          body = body + data;
      });
      request.on('end',function(){
        var post = qs.parse(body);
        var id = post.id;
        var filteredID = path.parse(id).base;
        fs.unlink(`data/${filteredID}`,function(error){
          response.writeHead(302,{Location:`/`});
          response.end();
        })
      });
    }
    else {
        response.writeHead(404);
        response.end('Not found');
      }
});
app.listen(3000);

 

//경로 : web2/lib/template.js

var template = {
    html: function(title,list,body,control){
      return ` 
      <!doctype html>
      <html>
      <head>
        <title>WEB- ${title}</title>
        <meta charset="utf-8">
      </head>
      <body>
        <h1><a href="/">WEB</a></h1>
        ${list}
        ${control}
        ${body}
      </body>
      </html>
    `;
    },
    list : function(filelist){
      var list = `<ul>`;
      var i = 0 ;
      while(i<filelist.length){
        list = list +`<li><a href="/?id=${filelist[i]}">${filelist[i]}</a></li>`
        i = i+1;
      }
      list = list + `</ul>`;
      return list;
    }
  }

  module.exports = template;