TIL 23-06-27

level·2023년 6월 27일

TIL

목록 보기
38/95

메일러로 메일보내기 성공하고 팀플 코드에 이식까지 하고
인증 api를 작성하면서 사용자가 입력한 바디(인증번호)를 어떻게 매칭시킬지에서 막힘
바디 파람을 랜덤넘버와 일치하는 조건문을 만들어야하는데 랜덤넘버를 어디에다 저장할지부터 고민이었음
구글에 찾아보니 세션에 저장하라는데 세션까지 추가하면 너무 복잡할것같고
그냥 유저에 저장하고 유저 불러올때 유저의 랜덤넘버값이랑 비교해야지 하고 모델을 고치려는데 이거 고쳐도 되는건가 싶어서 팀원분께 여쭤봄. 그리고 메일인증 안되면 글/댓글 권한 안되게 하는거에대해서도 같이 고민해봄
팀원분께서 고쳐도 되고, 로그인 전에 미들웨어에서 메일인증 필드도 검수해보는게 좋을것 같다는 아이디어를 주셨다
그래서 일단 유저 마이그레이션이랑 모델에 emailConfirm 필드, randomNumber필드 추가하고
회원가입 api에 user 생성에 randomNumber를 추가했다
그리고 이메일인증 api에 사용자가 입력한 code와 user.randomNumber를 비교하여 일치할 경우 인증 상태를 true로 업데이트하고, 일치하지 않을 경우 유효하지 않은 인증 코드로 처리하는 코드 추가했다
미들웨어에 user.emailConfirm을 확인하여 인증되지 않은 사용자일 경우 해당 요청을 거부하고, 인증되지 않음을 나타내는 메시지를 반환시켰다
마지막으로 사용자가 이메일 인증을 완료하면 user.emailConfirm을 true로 업데이트하고, 미들웨어에서 인증 상태를 확인

프론트엔드 시작

오랜만(?)에 HTML을 만드려니까 낯설었다... 2주 안했다고 이러다니 어이가 없다
그래도 대충 만들었는데 API연결 하려고 하자마자 온갖 초면인 에러들이 다 나타났다

회원가입 버튼을 누르면 인풋창이 나타나고 api body에 필요한 인풋값들을 세팅했다. 그리고 인풋값을 넣으면 api에 post요청을 보내고 성공/실패 응답을 받도록 설정했다.

일단 로컬호스트로 연게 문제였다
서버와 클라이언트가 일치해야하므로 다른 라우터처럼 app.js에서 열도록 처리했다
참고자료
https://m.blog.naver.com/PostView.naver?isHttpsRedirect=true&blogId=pjok1122&logNo=221545195520

회원가입이 잘 되었다. 노드메일러에서 에러가났는데 없는메일주소여서 그랬고 있는 주소로 넣으려고 새로 가입을 하니까 이미 있는 닉네임이라고 떴다. 관리자 네트워크에 들어가 보니 인풋값 받아온 것들이 다 안받아와져서 똑같은 공백이 입력받으니까 있는 닉네임이라고 한 것이다.
문제는 함수 실행하는 버튼을 잘못 찾아왔다. 회원가입 창을 여는 버튼과 창 속의 회원가입 버튼 두개였는데 첫번째 버튼을 불러오고 있었던것이다. 그래서 창을 여는 버튼을 누를때 api를 계속 요청하고있었고 두번째 버튼을 눌렀을때는 아무 동작도 시행하지 않고있었다... 버튼 바꿔주니까 잘된다 멍청이

메일인증은 어떻게 해야할지 감이오지않아 일단 썬더클라이언트에서 인증시켰다

그리고 로그인을 구현하려고 했는데 authorization 에러가 났다.
emailConfirm속성이 1로 바뀐걸 확인했는데 authorization에러가 나니 이유를 모르겠어서 튜터님께 찾아갔다. user를 콘솔로 찍어보니 엉뚱한 애가 찍혔다. 문제는 로그인 api에 auth를 넣어놓은 것이었다. 이메일인증 기능을 구현하면서 미들웨어에서 emailConfirm을 처리하고 거기서 넘어가지 않으면 로그인을 못하도록 구현해놓았는데, 그래서 미들웨어의 authorization에 쿠키가 잡혀서 밑으로 못넘어오고 있었다. 그래서 로그인에서 auth를 없애고 미들웨어에 있던 조건문을 로그인 api 안으로 옮겨서 검증하게 했다. 그러고 나서 프론트의 로그인 로직 주석을 풀고 페이지에서 로그인 시도를 했더니 성공했다.

내일은 로그인 시 새로운 페이지로 넘어가서 받아온 정보를 뿌려주는 단계를 해보려한다.

0개의 댓글