MVC패턴에서의 model이란 데이터를 가지거나, 가져오는 처리를 해주는 기능을 의미한다
오늘은 컨트롤러에 존재하는 user데이터를 저장하는 기능과 user데이터를 조작하는 기능을 나눠 model을 분리해본다
먼저 src아래 models폴더와 그아래 UserStorage.js파일을 만들고 컨트롤러의 user를 옮겨주자
그다음 home.ctrl.js에서 models의 UserStorage를 가져오고, console에 로그로 띄워보자. 편의를 위해 response코드는 잠시 주석처리하자
이제 서버 실행후 로그인 버튼을 누르면 이렇게 user데이터들이 출력된다
하지만 MVC패턴의 구조상 controller에서 데이터를 직접 접근할수 없어야 한다.
따라서 데이터 은닉화를 위해 user앞에 #을 붙여주도록 수정한다.
서버를 실행해보면 로그에 뜨던 데이터값이 undefined로 변한것을 확인할수있다
하지만 이 데이터를 가져오지 못하면 어떻게 로그인 인증기능을 구현할수 없다. 따라서 UserStorage.js에 데이터에 직접접근하지 않고 users 데이터를 참조할수 있는 get함수를 만들어준다.
이떄 getUsers()를 객체선언 전에 사용해야 하기 떄문에 static으로 선언해준다.
컨트롤러에서 변수에 접근하는 부분을 get메소드로 바꿔준다.
다시 서버실행후 확인해보면 로그에 users가 출력되는것을 확인할수 있다.
이제 컨트롤러에서 특정변수만을 처리할수 있도록 코드를 수정해주자
먼저 UserStorage객체에서 getUsers함수에 다음과 같은 로직을 추가해주고
컨트롤러에서 return 값을 로그로 출력해보자
출력으로 컨트롤러에서 파라미터로 넘긴 id,psword에 해당하는 배열이 출력된다.
이 로직을 간단히 설명하면
1. 배열인 fields[] 의 모든 값이 순서대로 field변수에 들어가 콜백함수를 수행하고 return을 newUsers에 저장한다.
2. 콜백함수에서는 hasOwnPropery()로 객체가 field와 같은 프로퍼티값을 가진값을 newUsers에 저장하고 리턴해준다
3. 모든 field값을 순회하면, newUsers객체를 반환한다.
함수 위주로 설명해 조금 복잡한데 더 쉽게 설명하면 users.id,users.psword 배열을 return해준다고 보면된다.
이제 home.ctrl.js에서 id,psword 배열을 받을수 있게되었다. users 변수에 배열을 넣어주고
로그인 부분의 주석처리를 빼서 원래 로그인 화면으로 돌려주자!
이후 서버를 실행해보면 로그인시 실패 페이지, 로그인 완료시 홈 화면으로 돌아오는것을 확인할수있다.
(정상 로그인시 홈화면으로 돌아오는 그림은 생략했다)
이제 로그인 인증 처리 또한 model에서 구현하기 위해 코드를 수정한다
컨트롤러에서는 User객체를 생성하며, 파라미터로 req.body를 넣어준다
req.body에는 로그인시 입력하는 정보가들어있기 때문에 이정보를 가지고 user.login()함수로 로그인 인증을 구현할 계획이다.
models폴더 아래 User.js파일을 만들고, login 메소드와 생성자를 만든다.
생성자를 만들면 req.body가 파라미터로 넘어와 입력 id,pwd 를 저장한 User 객체가 생성되고, login 메소드에서 그를 이용해
id가 존재하고, 비밀번호가 일치할때 / id는 존재하지만 비밀번호는 일치하지 않을때 / id가 아예 존재하지 않을때 세가지 에따라 다른 msg를 리턴한다.
id 입력시 id에 대한 모든 정보를 불러올수 있도록 UserStorage.js에 getUserInfo() 함수를 추가해준다
이제 실행을 하고 id,pwd를 입력해주면
이렇게 입력에 대한 응답이 로그에 잘 출력된다.
'nodejs' 카테고리의 다른 글
[nodejs express] render와 redirect의 차이 (0) | 2023.07.20 |
---|---|
[nodejs MVC 로그인기능] 17. nodejs프로젝트에 DB연결 (0) | 2023.07.14 |
[nodejs MVC 로그인기능] 12. 로그인 인증 기능 구현 (0) | 2023.07.14 |
[nodejs MVC 로그인기능] 11. fetch,bodyparser를 이용해 입력 데이터 서버로 보내기 (0) | 2023.07.14 |
[nodejs MVC 로그인기능] 10. Dom으로 Html 객체 제어 (0) | 2023.07.14 |