[Node.js] 글 생성

UI 만들기

기존에 있던 if(pathname === '/') 이외에 /가 아닌 create일 때의 조건문 생성

해당 조건문 내용 : 글을 작성할 수 있는 페이지 작성 , 기존의 template에 html의 form 태그 추가 

else if(pathname === '/create'){
      fs.readdir('./data', function(error, filelist){
        var title = 'WEB - create';
        var list = templateList(filelist);
        var template = templateHTML(title, list, `
          <form action="http://localhost:3000/process_create" method="post">
            <p><input type="text" name="title" placeholder="title"></p>
            <p>
              <textarea name="description" placeholder="description"></textarea>
            </p>
            <p>
              <input type="submit">
            </p>
          </form>
        `);
        response.writeHead(200);
        response.end(template);
      });

 

Post 방식으로 전송된 데이터 받기 

 

"node.js post data" 검색 후 나온 결과 - 아래 사진 참고 

웹브라우저가 post방식으로 데이터를 전송할 때, 데이터가 엄청나게 많으면 컴퓨터에 무리가 가는 문제가 생김 -> node.js는 post방식으로 전송되는 데이터가 많을 경우를 대비해서 특정한 양의 데이터를 서버에서 수신할 때마다 서버는 callback 함수를 호출하도록 약속되어있음 

form의 post 방식으로 가져온 데이터를 /create_process 페이지로 넘어가면서 확인하고자 할 때, createServer의 인자인 request로 데이터를 요청하고, 받은 데이터를 query string 모듈의 parse로 객체화 하여 데이터를 콘솔에 출력할 수 있음

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
      });
      response.writeHead(200);
      response.end('success');
    } else {
      response.writeHead(404);
      response.end('Not found');
    }
 

 

파일 생성

post 방식으로 전송된 데이터를 data directory안에 file의 형태로 저장하는 방법

"node.js file write"

https://nodejs.org/dist/latest-v12.x/docs/api/fs.html#fs_fs_writefile_file_data_options_callback

File system | Node.js v12.18.3 Documentation

위에서 작성한 request.on('end',function(){ } 안에 다음의 코드를 작성한다. 

fs.writeFile(`data/${title}`, description, 'utf8', function(err){
            response.writeHead(200);
            response.end('success');
          })

 

리다이렉션

콜백함수 안에서 작성한 페이지를 확인하기 위해 그 페이지로 넘어가는 것

"node.js redirection"  - 검색 후 나온 결과 아래 사진 참고

위에서 작성한 fs.writeFile(){ } 안의 response.writeHead( ) 부분을 아래와 같이 수정

fs.writeFile(`data/${title}`, description, 'utf8', function(err){
            response.writeHead(302, {Location: `/?id=${title}`});
            response.end();
          })