[nodejs MVC 로그인기능] 12. 로그인 인증 기능 구현

오늘은 지난번에 컨트롤러로 데이터를 받아오는 기능을 이용해, 인증기능을 간단하게 구현해본다.

 

home.ctrl.js에서 먼저 user변수를 추가해 임의로 세명의 사용자를 만든다. 각 아이디는 lls,eeo,abv이다.

또 process.login()함수에서 id와 psword변수에 req로 받은 데이터의 id,psword를 저장한다.

저장한 id,psword를 이용해 간단한 인증을 한다.

 

if절부터는 입력한 id가 존재하면, id의 인덱스를 저장하고 해당 인덱스의 비밀번호 값과

받은 입력데이터의 비밀번호가 같으면 succes에 true 담는다.

 

id가 없거나 비밀번호가 id의 인덱스와 일치하지 않는다면, succes를 false로 설정하고

로그인 실패 메세지를 msg에 담는다.

 

이때 담은 데이터는 res 즉 response(응답)으로 login.js에 되돌려 준다.

보낸 응답을 받기위해 login.js 또한 수정해주자

응답을 받을때는 fetch함수에 then을 붙여 응답을 받아준다 코드가 조금 복잡해 보일수 있는데

fetch함수는 json에 대한 첫 응답을 promise형태로 보내 첫 then() 함수 이후 then() 함수를 한번 더 사용해야 한다. 

지금은 이해가 잘가지 않을수 있으니 1번까지는 받은 데이터를 바로 출력할수 없는 형태로 보내지고,

2번부터 출력 가능하다고 알고있으면 된다.

 

이제 서버를 실행해 then의 로그를 보면

 

컨트롤러에서 만들었던 id,pwd에는 true, 일치하는 정보가 없으면 false가 나오는것을 확인할수있다.

 

이제 데이터가 req와 req ( 요청과 응답 ) 이 오가는것을 확인했다.

본격적으로 만들기 위해 로그인시 메인화면으로 돌아가고, 실패시 또다른 처리를 할수 있도록 해보자

 

이제 res.success가 true일경우 처음 경로인 home으로 오고

로그인을 실패할경우 msg에 담겨있는 "로그인에 실패하셨습니다" 라고 alert로 출력하게 된다

또 로그인중 에러가 발생할 경우 콘솔에 에러문구를 출력해준다

로그인을 성공해 메인페이지로 이동

 

로그인에 실패해 창 띄워짐