ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 제로부터 시작하는 Node.js - 11. Express 모듈 - 3 (미들웨어 2)
    내가 보기 위해 쓰는 것/Node.js 2019. 11. 16. 16:03

    바로 이어서 주요 미들웨어 몇가지를 더 소개하겠습니다.

     

    1. body parser 미들웨어

    body parser 미들웨어는 post요청 데이터를 추출하는 미들웨어입니다.

    설치를 해야 사용할 수 있는 미들웨어입니다.

    npm install body-parser

    body parser를 이용하여 간단한 로그인을 구현해보겠습니다.

     

    index.html 입니다.

    form 태그의 method가 post입니다.

     

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>Document</title>
    </head>
    <body>
      <h1>Login</h1>
      <form method="post">
        <table>
          <tr>
            <td><label>ID</label></td>
            <td><input type="text" name="id" /></td>
          </tr>
          <tr>
            <td><label>PW</label></td>
            <td><input type="password" name="pw" /></td>
          </tr>
        </table>
        <input type="submit">
      </form>
    </body>
    </html>

     

    index.js 입니다. 소스가 조금 길지만 읽어보시면 이해가 되실거라고 생각합니다.

     

    const express = require('express')
    const fs = require('fs')
    const cookieParser = require('cookie-parser')
    const bodyParser = require('body-parser')
    
    const app = express()
    
    app.use(cookieParser())
    app.use(bodyParser.urlencoded({ extended: false }))
    
    app.get('/', function (req, res) {
      if (req.cookies.auth) {
        res.send('<h1>Login success</h1>')
      } else {
        res.redirect('/login')
      }
    })
    
    app.get('/login', function (req, res) {
      fs.readFile('index.html', function (err, data) {
        res.send(data.toString())
      })
    })
    
    app.post('/login', function (req, res) {
      const id = req.body.id
      const password = req.body.pw
    
      console.log(id, password)
      console.log(req.body)
    
      if (id == 'admin' && password == '1234') {
        res.cookie('auth', true)
        res.redirect('/')
      } else {
        res.redirect('/login')
      }
    })
    
    app.listen(52273, function () {
      console.log('server is running')
    })

     

    127.0.0.1:52273/login 으로 접속하면 로그인 페이지가 뜹니다.

     

     

    여기서 index.js 에서 적힌 내용을 상기하면서 로그인을 시도해봅시다.

     

    admin, 1234로 로그인을 하면 쿠키가 저장되며 리다이렉트되고, 그렇지않으면 그대로 돌아옵니다.

     

     


     

    요청방식과 별개로, 인코딩 방식이란 것도 있습니다. post 방식이라고 해서 다 같은 post방식인 것이 아니라, 인코딩 방식이 또 따로 있습니다. 이에 따라서 body-parser 미들웨어가 지원하지 않을 수 있습니다. 다만 이부분까지 가면 너무 글이 길어지기 때문에 따로 찾아보시라고 할 수밖에 없네요. 대표적으로 connect-multiparty 라는 미들웨어가 있습니다.


     

    2. express-session 미들웨어

    express-session 미들웨어를 마지막으로 소개하겠습니다. 많이 길어졌네요.

     

    쿠키가 보통 브라우저에 정보를 저장하는 기술입니다. 세션은 서버에 정보를 저장하는 기술이라고 생각하시면 될 것 같습니다.

     

     

    이런 식이라고 보면 되겠습니다.

     

    express-session도 설치가 필요합니다. 이제 슬슬 예상이 되시죠?

    npm install express-session

    다만 이 미들웨어는 좀 복잡합니다.

     

    일단 간단한 예제를 보겠습니다.

     

    const express = require('express')
    const session = require('express-session')
    
    const app = express()
    
    app.use(session({
      secret: 'secret key',
      resave: false,
      saveUninitialized: true
    }))
    
    app.use(function (req, res) {
      req.session.now = (new Date()).toUTCString()
    
      res.send(req.session)
    })
    
    app.listen(52273, function () {
      console.log('server is running')
    })

    이렇게하고 127.0.0.1:52273 에 접속하면 json 문서가 나타납니다.

    크롬 개발자 도구등을 이용해 쿠키도 같이 확인해주세요.

     

     

    app.use(session({

      secret: 'secret key',

      resave: false,

      saveUninitialized: true

    }))

     

    세션에 여러가지 속성을 부여합니다. 이 부분이 중요합니다.

     

    위에 들어가는 속성, 옵션들을 정리했습니다.

     

    옵션 설명
    name 쿠키의 name 지정
    store 세션 저장소 지정
    cookie cookie 정보 지정
    secret 비밀 키 지정
    resave 세션이 변경되지 않았어도 세션저장소에 반영할지 설정
    saveUninitialized 초기화되지 않은 세션을 저장소에 저장할지 설정

     

    cookie 옵션이 또 하위 옵션을 가지고 있습니다.

    cookie 옵션을 입력하지 않았을 시는 이렇게 자동입력 됩니다.

     

    { "originalMaxAge": null, "expires": null, "httpOnly": true,  " path":"/" }

     

    session 객체의 메소드도 정리해야 겠네요.

     

    메서드 설명
    regenerate() 세션을 다시 생성
    destroy() 세션 제거
    reload() 세션 다시 불러오기
    save() 세션 저장

     

    많이 복잡하죠... 아직은 다 외우지 말도록 합시다.

     

     

    이정도면 주요한 미들웨어는 많이 살펴본 것 같습니다. 미들웨어라는 개념 자체가 무엇인지 알아가셨으면 합니다.

     

    다음 글은 지금까지 다룬 내용을 바탕으로 RESTful 규정에 맞춘 웹 서비스 개발에 대해 다루겠습니다.

    댓글

Designed by Tistory.