🧐 개요

connect-mongo를 이용해

Node에서 MongoDB와 연계하여 세션을 다루는 방법을 정리합니다.

📋 connect-mongo 설치

npm install connect-mongo --save

📋 express-session 설치

npm install express-session --save

📋 Codes

const session = require('express-session');
const MongoStore = require('connect-mongo');

app.use(express_session({
    secret:config.secret,
    resave:false,
    saveUninitialized:false,
    store: MongoStore.create({mongoUrl:`your mongo url`}),
    cookie:{maxAge:(3.6e+6)*24} // 24시간 유효
}))

별 다를 것 없이 세션을 저장할 위치를 MongoDB로 지정해주면 됩니다.

저 같은 경우는 server가 열리는 index.js에 작성해두었습니다.

세션이 생성되면 아래 화면의 session model에 document가 생성됩니다.

📋 Login, Logout

세션 활용에 나아가, 로그인 / 로그아웃 절차를 확인해봅니다.

🔧 Login (Backend)

암호화와 관련된 부분은 다음 게시글에 설명되어 있습니다.

https://velog.io/@leitmotif/%EC%95%94%ED%98%B8%ED%99%94%EC%99%80-%EC%84%B8%EC%85%98-3

🔧 Login (Frontend)

Front에서는 전달받은 loginSuccess값을 통해 로그인 여부를 판단합니다.

true라면 성공, false라면 실패로 판정하고

각각 해당하는 url로 이동시킵니다.

🔧 Logout (Backend)

로그아웃은 그저 세션을 지워주면 될 일입니다.

Front로 logoutSuccess:true 상태를 전달합니다.

🔧 Logout (Frontend)

저는 따로 라우팅되지 않는 NavBar에 로그아웃 버튼을 넣었습니다.

dispatch는 <Provider> 태그로 wrapping되어야하고
wrapping된 App.js는 라우팅 컴포넌트만 넣어두었습니다.

만약 실수로 dispatch를 사용한다면 위와 같은 오류를 발견할 수 있습니다.

따라서 dispatch...reducer...action... 등의 작업을 하지 않고
바로 axios 함수로 서버의 동작을 읽어옵니다.

그리고 NavBar는 라우팅되지 않으므로 props를 따로 가지지 않습니다.

따라서 간단히 window.location.href='/'을 통해 라우팅을 지정합니다.