[Express] Session으로 인증 구현하기_1

0. 출처

 

express-session을 이용한 인증구현 - 생활코딩

 

오픈튜토리얼 생활코딩 참고.

 

---

1. 목표

 

세션을 활용해서 로그인 기능을 구현한다.

 

당장은 다중 사용자를 고려하기보단, 하나의 ID, Password만 사용해서 로그인하는 것을 가정한다.

 

단일 사용자 환경에서 인증, 인가를 모두 구현한 다음, 추후 다중 사용자 환경에서도 동작하도록 확장할 계획이다.

 

---

2. 인증 기능 구현

 

가. 링크 추가

 

 

day (혹은 night) 버튼 옆에 login 링크가 생기도록 한다.

 

클라이언트에게 보여지는 모든 페이지에 링크를 추가한다.

 

<a href="/auth/login">login</a>

 

나. authRouter 추가

 

/auth/login을 처리할 수 있는 라우터를 추가한다.

 

/// app.js
const authRouter = require("./routes/auth.js");
app.use('/auth', authRouter);

// ./routes/auth.js
const express = require('express');
const router = express.Router();
const template = require("../lib/template.js");

const authData = {
    email: 'email',
    password: 'password',
    nickname: 'tiredI'
}

router.route('/login')
  .get(template.List, (req,res,next)=>{
    req.title = "login";
    req.desc = `
      <form action="/auth/login" method="post">
        <p>
            <div>
                <label>
                    <b>Email</b></br>
                    <input type="text" name="email" placeholder="email" required>
                </label>
            </div>
            <div>
                <label>
                    <b>Password</b></br>
                    <input type="password" name="pwd" placeholder="password" required>
                </label>
            </div>
        </p>
        <input type="submit" value="login">
      </form>
    `;
    req.control = '';
    req.author  = '';
    next();
  },template.HTML)
  .post((req,res,next)=>{
    let post = req.body;
    let email = post.email;
    let password = post.pwd;
    if(email == authData.email && password == authData.password){
        res.send(`<script>window.alert("삑! 환영합니다.");window.location.href = '/';</script>`);
    }else{
        res.send(`<script>window.alert("삐빅! 틀렸습니다. 다시 시도하세요");window.location.href = '/auth/login';</script>`);
    }
  });

module.exports = router;

 

• const authData = {...} : 임시로 저장한 올바른 id, password 값. 나중에 다중사용자 구현하면 db로 이동해야 함.
• <label>B<input></label> 또는 <label for="A”>B</label> : B를 눌러도 input이나 A처럼 동작. 클릭하기 편해짐.
• <input … required> : 필수 입력 필드 지정. 비어있으면 안 넘어감.
• if(email == authData.email && password == authData.password){...} : 올바른 아이디, 패스워드인지 확인하고 결과에 따른 동작을 수행함.

 

로그인 화면

올바른 아이디, 비밀번호 입력 시

틀린 아이디, 비밀번호 입력 시

 

---

3. 세션 미들웨어 설치

 

npm install express-session
npm install express-mysql-session

session store로서 mysql을 사용한다.

//app.js
const session = require('express-session');
const MySQLStore = require('express-mysql-session')(session);

...
const options = {
    host: process.env.MYSQL_HOST,
    port: process.env.MYSQL_PORT,
    user: process.env.MYSQL_USER,
    password: process.env.MYSQL_PASSWORD,
    database: process.env.MYSQL_DATABASE
};

const sessionStore = new MySQLStore(options);

app.use(session({
    //key: 'session_cookie_name',   // table의 기본 키(primary key)
    secret: process.env.SESSION_COOKIE_SECRET, //복잡한 아무 문자열(특수문자 가능)
    store: sessionStore,
    resave: false,
    saveUninitialized: false
}));

sessionStore.onReady().then(() => {
    console.log('MySQLStore ready');
}).catch(error => {
    console.error(error);
});

기본 옵션을 사용하면 mysql의 MYSQL_DATABASE에 새로운 테이블 sessions가 자동으로 생성된다.

 

 

생성되지 않으면 아래 스키마를 참고하자.

 

CREATE TABLE IF NOT EXISTS `sessions` (
  `session_id` varchar(128) COLLATE utf8mb4_bin NOT NULL,
  `expires` int(11) unsigned NOT NULL,
  `data` mediumtext COLLATE utf8mb4_bin,
  PRIMARY KEY (`session_id`)
) ENGINE=InnoDB;

로그인에 성공했을 때 세션에 저장할 데이터를 작성한다.

 

// ./routes/auth.js
if(email == authData.email && password == authData.password){
  req.session.is_logined = true;
  req.session.nickname = authData.nickname;
  res.send(`<script>window.alert("삑! ${authData.nickname}님 환영합니다.");window.location.href = '/';</script>`);
}else{
    res.send(`<script>window.alert("삐빅! 틀렸습니다. 다시 시도하세요");window.location.href = '/auth/login';</script>`);
}

• req.session.is_logined = true;  
• req.session.nickname = authData.nickname;

 

session_id를 저장하는 쿠키가 생성되었다!

 

mysql.opentutorials.sessions에 세션 데이터가 저장된다!

 

---