게시판 시작해봅시다 -3

우선 지난번 강좌에서 수정사항이 조금 있습니다. 게시판인데 게시판 상단 항목명을 나타내는 부분이 빠져있었죠?

추가했습니다.

ejs도 고쳐주고..(앗, 18번째 줄에 탭이 하나 더 들어갔네요.. 이건 그냥 넘어가죠 ㅠ)


css도 추가해줍니다.


그리고 사실 지난번 포스팅의 몇몇 ejs에 오자가 있었는데 그것도 수정하였습니다.
 

그리하여..  git-hub에 다시 올렸으니까 다시 받아주시면 되겠습니다.

https://github.com/imtaekh/my_app/tree/d3d368def778b2105e0dc003f5f2ebad28bf268d 에서 받아주세요.

그럼, 이제 본격적으로 계정만들기를 시작하겠습니다.

먼저 이번 포스팅에서 사용할 package들을 설치할게요.

아래 명령어로 한번에 5개를 설치합니다.

npm i passport passport-local express-session connect-flash async --save

--save 를 입력하면 자동으로 package.json에 등록이 됩니다.

하지만 코드 본문에는 직접 입력을 해 줘야 합니다. 4개를 코드 상단에 입력했고,

passport-local은 쓰이는 부분에만 직접입력하겠습니다.

 

package	하는 일
passport	nodeJS에서 계정관리를 할 때 가장 많이 쓰이는 package입니다. 300개 이상의 인증방식을 지원한다고 웹사이트에서 광고를 하고 있죠.   이 각각의 인증방식을 strategy라고 부르는데, 페이스북을 이용해서 로그인하는 것을 facebook strategy, 트위터를 써서 로그인하는 방식을 twitter strategy 이런 식입니다. 웹사이트에 들어가면 회원가입을 하지 않고 페이스북버튼을 누르면 페이스북 로그인창이 뜨고 정보를 입력하면 가입되는 방식같은 것들이죠.  우리는 좀 더 고전적인, 사이트에 직접 가입하는 방법을 사용하겠습니다. 이것을 local strategy라고 합니다.  그래서 passport-local 페키지도 설치를 한것이구요.
express-session	로그인이 되고 나면 로그아웃을 하기 전까지 웹사이트는 해당 유저가 로그인이 되어 있다는 것을 알고 있습니다. 또한 해당 유저별로 데이터를 따로 관리할 수도 있죠. 이 정보가 session으로 저장되기 때문인데. 이를 도와 주는 package입니다.
connect-flash	session에 자료를 flash로 저장하게 해주는 package입니다. flash로 저장된 정보는 한번 읽어오면 지워집니다. 주로 서버에서 유저에게 메세지를 날리는 용도로 많이 쓰입니다. 코드를 보시면 이해가 될 겁니다.
async	nodeJS는 기본적으로 callback을 사용해서 비동기(async)로 동작합니다. 시간이 걸리는 부분에서 마냥 기다리지 않고 다음 코드를 먼저 진행하여 대기시간을 줄이는 것이지요. (시간이 걸린다고 무조건 넘어가는 것이 아니라 비동기를 사용하고 있는 함수에서만 이렇습니다. 내가 쓴 코드가 다음줄로 넘어가면 어떡하나 걱정할 필요는 없습니다.) 이 package는 비동기를 도와주는 package같은데, 전 비동기 함수들을 동기(sync)로 사용하기 위해 사용하였습니다.

 

사용자 계정을 DB에 저장하려면 모델을 먼저 만들어야 겠죠?

email, nickname, password를 갖는 유저 스키마를 만들었습니다.

33, 34번째 줄에 unique:true라는 속성이 들어갔는데, 이 속성이 있는 경우 data 생성, 수정시에 이 스키마의 다른 자료들을 비교하여 동일한 값의 자료가 있으면 생성, 수정을 하지 않고 에러를 보내게 됩니다. 

middleware들을 설정합니다.

다른 middleware와 마찬가지로 flash를 사용하려면 app.use(flash());를 꼭 사용해 주어야 합니다.

passport는 다른 미들웨어와는 다르게 설정법이 복잡합니다 ㄷㄷㄷ.

50번째 줄: session은 passport에서만 사용되는 것은 아니지만 로그인을 유지시키려면 사용되어야 합니다. secret은 session을 암호화 할때 사용되는 비밀 hash키 값입니다. 이 값은 서버에만 가지고 있기 때문에 혹시라도 해커가 session을 훔쳐가더라도 임의로 session을 생성할 수 없게 됩니다.(물론 빼앗긴 session은 해커가 사용가능합니다..)

serializeUser는 session 생성 시에 어떠한 정보를 저장할지를 설정하는 것으로, 현재 user 개체를 넘겨 받아서, user.id를 session에 저장하고 있습니다.(이때 id는 username이 아니라 db의 id입니다.)

deserializeUser는 session으로 부터 개체를 가져올 때 어떻게 가져올 지를 설정하는 것으로, 현재 id를 넘겨받아(위에서 id를 session에 저장하기로 했으므로) DB에서 user 를 찾고, user를 가져오게 됩니다.

이렇게 가져온 user는 req.user에서 session이 유지되고 있는 동안에 언제든지 접근 가능하게 됩니다.

이게 끝이 아닙니다. 어떤 strategy를 사용할지를 설정해야 합니다.

63번째 줄 : 우리가 사용할 local strategy를 package로부터 가져옵니다.

64번째 줄 : strategy에 이름을 지어줍니다. local-login이라고 지었습니다.

65번째 줄 : 본격적으로 local-login을 설정해봅니다.

66~67번째 줄 : local strategy는 default로 user개체에서 username과 password를 찾아 읽습니다. 아이디와 비밀번호를 나타내는 부분이 user 개체에서 다른 이름으로 저장되어 있다면 이렇게 재설정을 해줘야 합니다. 현재 username대신 email을 아이디로 사용하므로 그렇게 설정해 줬고 password는 그대로이지만 사용법을 알려드리기 위해 한번 해봤습니다.

79~84번째 줄 : 실제적으로 어떻게 유저를 특정할지에 대한 함수 설정입니다. 우선 user를 찾고, user가 없으면 flash 에러메세지를 생성합니다. 그다음 비밀번호가 매치되는지를 알아보고, 모두 통과하면 user개체를 내보냅니다. 이 user개체를 이용해서 위에서 설명한 session을 생성하게 됩니다.

이제 route를 설정해 줍니다.

89~91번째 줄 : root route를 설정안했더라구요. 자동으로 게시판으로 이동하도록 했습니다.

92~94번째 줄 : login form이 있는 view를 불러오는 route입니다. 위에서 로그인시 에러가 있으면 에러를 flash로 보냈잖아요? loginError에서 이것을 잡아와서 view로 보냅니다.

95~110번째 줄 : login form에서 받은 정보로 로그인을 실행하는 부분입니다. 97번째 줄에서 혹시라도 남아 있을지 모르는 flash 이메일을 지워주고, 98~104번째 줄에서 기본적으로 form에 정보들이 다 있는지를 확인해서 없으면 에러메세지와 함께 다시 login페이지로 redirect합니다. 아무이상이 없으면 103의 next를 통해 다음 함수로 넘어갑니다. 다음함수는 passport.authentication입니다.

105~109번째 줄에서 위에 우리가 이름지은 local-login을 불러와서, 아무런 이상이 없는 경우 /posts로 redirect하고, 이상이 있는경우 다시 login페이지로 보내도록 설정했습니다.

111~114번째 줄 : logout하는 방법입니다. passport에서 자체적으로 req.logout()이라는 함수를 제공해 줍니다.

계정은 아직 갈길이 많이 멉니다.. 이번 포스팅은 테스트해볼 수도 없지만 내용이 너무 길어서 한번 쉬어가겠습니다.

로그인까지는 코딩이 이미 다 되어 있으므로 빠른 시일내에 다시 돌아오겠습니다.

눈치 채신분도 있겠지만 이 포스팅에서는 password를 암호화 하고 있지 않습니다. 즉, 사용자가 입력한 password가 db에 그대로 저장되는되요, 해커가 db를 털어가면 사용자들의 password를 알수 있다는 뜻이죠.. 아주 위험한 방법입니다만 일단 이렇게 만들고 다음번에 bcrypt로 암호화 하도록 하겠습니다.

앞으로의 강의 방향 

로그인 -> password 암호화 -> 게시판 연동

[출처] [Node.js 강좌] 10-1. 계정, 로그인 -1- (passport, User 모델)|작성자 azure0777