Node.js-passport

참조:  www.passportjs.org/docs/

Documentation

목표 :  session으로 구현한 인증을 passport(user&pwd로그인 전략)로 재구현 해보자

 

1.passport 설치

npm install -s passport

 

2 username & password npm 설치

 

3. 위 예제의 configuration 에 있는 passport 코드 복붙 

 passport는 반드시 session을 내부적으로 사용하기 때문에 express  session을 활성화 시키는

코드 다음에 등장해야 한다

 

4. passport를 이용하여 post정보 받기 구현

 

passport를 이용해서 로그인기능을 구현하기 위해서는 form에서 정보를 전송 할때 

어디로 데이터를 전송하도록 되어 있냐면 routes/auth.js에서 /login_process 인데

이 부분을 passport 체계로 바꿔줘야한다 따라서 위 코드는 주석처리 하고

passport버전으로 바꿔보자

 

auth.js안에서가 아닌 main.js로 나와서 메뉴얼의 인증부분에서 아래쪽 코드를 복붙

 

app.post('/auth/login_process')로 데이터가 들어오면 그 데이터를 처리하는 콜백이 들어오는데 passport에서

제공하는 API 가 그것을 대신한다 'local'은 passport의 여러가지 전략중에 username&password

전략에서 사용하는 것이다

redirect  코드는 성공했을떄는 /으로 실패했을때는 /auth/login으로 보내는 것

 

5.그럼 도대체 어떻게  로그인성공여부를 판가름 하느냐?

passport메뉴얼의 configue 를 참조하여 코드를 복붙하쟈

그리고 간략화 하고 이해하기 위해 일부분을 주석처리 하자

그리고 로그인을 해보면 아무일도 일어나지 않는다 왜냐하면 실패하면 /auth/login으로 리다이렉션 했기

때문이다 즉 실패한것이다 

그리고 메뉴얼의 Form을 보면 우리가 passport를 이용할때는 아래처럼 form을 작성해라

그때에 name값은 username라는 이름으로 전송하고 password값은 passoword 로 전송하라 라고 약속 되어 있는데

우리는 현재 post방식으로 데이터를 전송할때 name은 email로 password는 pwd로 전송하고 있다

그렇기에 위form 양식처럼 username과 password값으로 전송하기 싫다면 

이 약속을 바꿀수 있는데 passport 메뉴얼의 parameters 를 참조하면 그 값을 임의로 바꿀수 있는 방법을 알려준다

기존 작성코드 중 new LoalStrategy()에 아래 예시 처럼 인자를  추가해 주고 

usernameField를 우리가 전송하는 email 

passwordField를 우리가 전송하는 pwd로 작성한다

 

코드를 작성추가 하고 콘솔로그를 통하여 

이 콜백이 잘 호출되는지 그리고 passport가 username과 password를 콜백 내로 잘 주입시켜주는지

확인해보자

로그인을 해보면 입력한 이메일과 비밀번호가 출력되는데 이것은 즉

username으로 이메일이 뜬것은 콜백함수가 호출될때 passport가 첫번째인자로 우리가 form에서 

전송한 값을 주엇기 때문에 입력한 이메일이 출력되는 것이다

결론적으로

우리가 auth.js의 /auth/login UI에서 email과 password를 wellco@naver.com 과 111111 로 입력하면

(name)email : (value)wellco@naver.com, (name)pwd: (value)111111 이라는 데이터가

post방식으로 main.js 에 있는 passport로 전송되며

 

passport.use(~)안에 있는 new LocalStrategy()함수의 첫번째 인자로 객체를 주는데 이것은

받을 post정보의 name이 무엇인지 설정해주며 

new LocalStrategy()의 두번째 인자로 콜백함수를 주는데 여기서 콜백함수의 첫번째인자와 두번째인자는

앞서 받은 name을 가진 post정보의 value를 나타내는 것이다.

6.그럼 도대체 어떻게  로그인성공여부를 판가름 하느냐?(2)

위에서 우리가 만든 웹애플리케이션의 로그인UI에서 이메일과 비밀번호를 입력 했을때

new LocalStrategy()의 두번째 인자인 콜백함수의 첫번째 인자username와 두번째인자 password로 그 입력값을 가져올 수 있다는 것을 확인했다 그러면 세번째 인자인 done의 역할은 무엇이냐

 

1. 로그인이 성공할 사용자의 이메일과 비밀번호 정보를

authData로 정의하고

 

2. 사용자가 입력한 이메일과 비밀번호를 username과 password로 받아서 

 

만약 우리가 입력한 username의 값과 authData.email의 값이 같지 않다면

done이라는 함수를 호출하는데 그 함수의 두번째 인자로 로그인 실패를 나타내는 false를 주고, username이 틀렸다는

메세지를 호출한다 console.log(3)

 

또 만약 우리가 입력한 password의 값과 authData.password의 값이 같지 않다면

위와 같은 로직의 done 함수를 호출한다 console.log(2)

 

만약 둘다 잘 입력했다면 done의 두번째 인자는 없는데 이것은 true를 나타낸다 그리고 세번째인자로

성공한 사용자의 정보는 무엇인지를 passport에게 알려주기 위해 authData를 준다 console.log(1)

 

 

바로 done이라는 함수를 어떻게 호출하느냐에 따라서 로그인의 성공실패여부를 passport에게 알려줄 수 있다

 

 

U