[Node.js] mysql session store 구성하기

‍정진철·2023년 3월 3일
1

세션 스토어

유저 로그인 시 해당 정보를 세션에 등록하기 위해서는 sessionStore가 요구
된다.

세션이란?

앞서 설명했던 쿠키는 웹 브라우저에 저장되는 '키-밸류' 타입의 데이터라고 언급했습니다. 따라서 누구나 키에 따른 밸류를 확인할 수 있으므로 비밀정보를 쿠키로 보낸다면 비밀 정보를 아주 쉽게 탈취당할 수 있습니다.

세션은 이러한 문제점을 고려해서, 쿠키를 업그레이드 한 것이라 보면 됩니다. 쿠키와 달리 서버에 데이터를 저장하고 웹 브라우저는 Session ID만을 가지고 있기 때문에 비교적 안전합니다.

세션의 동작을 요약하면 다음과 같습니다.

  1. 서버는 웹 브라우저에게 세션 값을 보내줍니다. (sid 라고 하며, 아무런 의미도 없는 단순 식별자입니다.)

  2. 클라이언트는 접속할 때 자신이 가지고 있는 sid를 서버에게 전달합니다.

  3. 서버는 클라이언트가 보내준 sid를 가지고, 해당 유저를 식별합니다.


1. 세션 설치하기.

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

express-session 만으로는세션이라는 기능을 제공할 수 없고 저장소를 따로 사용해줘야한다.

mysql을 저장소로 사용하는 'express-mysql-session'을 사용.

2. express-session 설정

import MySQLStore from 'express-mysql-session';
const MySQLStoreSession = MySQLStore(session);

var options ={      
  host: '127.0.0.1',
  port: 3306,
  user: process.env.DB_USER,
  password: process.env.DB_PASS,
  database: process.env.DB_NAME
};
 

var sessionStore = new MySQLStoreSession(options);
app.use(cookieParser());
app.use(session ({
  name: 'session',
  secret: 'thisshouldbeabettersecret!',
  resave: false,
  saveUninitialized : false,
  touchAfter: 24 * 60 * 60,
  store :sessionStore,
  cookie: {
      httpOnly: true
      // secure: true,
      expires: Date.now() + 1000 * 60 * 60 * 24 * 7,
      maxAge: 1000 * 60 * 60 * 24 * 7
  }

}))

3. res.locals middleware 설정

res.locals는 Express.js 프레임워크에서 제공하는 객체 중 하나로, 뷰(View)에 전달되는 로컬 변수(local variables)를 설정하는 데 사용됩니다.

뷰 파일에서 사용되는 데이터를 전달하기 위해 res.locals 객체를 이용할 수 있습니다.

res.locals 객체에 설정된 변수는 뷰 파일에서 직접 참조할 수 있습니다.

4. 로그인 기능

로그인 성공 시 ( 유저네임과 비밀번호가 일치 시) req.session에 속성으로 loggedIn 은 true, 그리고 세션에 존재하는 유저의 정보는 위에서 언급한 user(const user = await findUser) 로 설정.


이렇게 되면 위에서 만든 미들웨어에서 유저가 로그인을 성공하게 되면 res.locals.currentUser에 req.session.user 즉 세션에 있는 유저의 정보가 할당되고 login.ejs 파일에서 사용할 수 있는 것이다.


5. home.ejs 설정

         <nav class="nav nav-masthead justify-content-center float-md-right">
            <a class="nav-link active" aria-current="page" href="#">Home</a>
            <a class="nav-link" href="/cafe/info/1">Cafes</a>
            <% if(!currentUser) { %>
            <a class="nav-link" href="/login">Login</a>
            <a class="nav-link" href="/register">Register</a>
            <% } %> <% if(currentUser) { %>
            <a class="nav-link" href="/logout">Logout</a>
            <% } %>
          </nav>
          

위 처럼 로그인을 안했을 땐 login,register를 보여주고 login한 유저 그러니깐 res.locals.currentUser가 존재하는 상황이면 logout만 보이게끔 해주는 것이다.


로그인 전

로그인 후

req.session을 콘솔에 찍어보면..

loggedIn, user 속성 확인 가능


profile
WILL is ALL

0개의 댓글