이 부분에서 다루는 모든 오류 및 해결법은 코드스테이츠[블록체인]과정 블로그중
session을 이용한 로그인 실습
에서 발생했던 오류 및 해결법 이다
다음날 복습겸 일어나서 어제 진행한 실습을 다시 살펴 보았다.
그중 정상적으로 원해진 test는 통과는 하지만 구현이 제대로 이루어 지지 않고 있다느 것을 알게 되었다.
원인은 간단했다.
test할떄에는 각 요청마다 session이 새로 생성이되고 해당 session을 보내어서 값이 정확히 있는 것인데
구현을 하게 될떄는 session을 하나만 생성을 하고 그것을 계속 수정해가면서 사용을 해야한다.
예시를 들어보자
내가 짜놓은 코드이다.
보게 되면 로그인 버튼을 누르게 되면 두개의 axios가 발생 하는 것을 알수가 있다.
일단 우선적으로 Post가 작동을 하게 된다.
post부분이다.
일단 기본적으로 db에 값이 있다는 것을 알아두자.
일단 db에 있는 알맞은 값을 입력을 하면 userInfo에 값이 들어오고
그 값에서 id값을 세션에 저장을 하게 될것이다.
그러면 post요청은 끝나게 된다.
그럼 다시 첫번쨰 사진을 참고하면 드후 get요청을 하게 된다.
get요청을 처리하는 곳이다.
터미널을 보면 알수 있듯이 아까 post요청을 통해서 저장한 session이 유지 되지 않는 것을 알수가 있다.
이게 내가 아까 말한 그 부분이다.
이 부분을 해결 해야한다... ㅠ
나는 바보였다... 일단 기본적으로 클라이언트가 통신을 하는 부분이 잘못 되었다.
이렇게만 수정을 하여 작성을 하였다.
일단 서버 자체를 https
로 열었는데 클라이언트는http
이기 떄문에 기본적으로 cors
적용 등이 이루어 지지 않는 것이다.
이 코드의 실행 자체를 HPPTS로 통신하기 위해서 mkcert
를 이용해 만든 인증서를 사용해야 한다.
이렇게 되면 일단 클라이언트와 서버가 둘다 HTTPS로 통신을 하게 되엇다.
그러면 cors설정을 보자
일단 들어오는 기본 위치(origin)을 클라이언트 기본 주소로 해주었다.
그후 methods, credentials등을 설정을 해주었다.
credentials
- 쿠키,세션을 유지할지 말지를 결정하는 곳이다.
- 기본값은 false이기 떄문에 따로 지정하지 않으면 세션이 유지되지 않는다.
credentials
이 부분이 핵심이다.
위에 로그인을 구현한 코드를 보면
post를 보내고 다시 get을 보내는 것을 알수가 있다.
만약 credentials
을 따로 설정하지 않으면
post보낼떄 새션 새로 생성
get보낼떄 새션 새로 생성
이렇게 작동을 하게 되기 떄문에 기존에 사용하던 사용자인지 서버에서 인식을 하지 못한다.
credentials
를 설정해주어야 한다!!!!이 부분이 가장 중요하다
그럼 일단 cors설정은 끝나게 된다.
하지만 이렇게만 해서는 세션이 유지가 되지 않는다.
따로 추가적인 설정을 해줘야 하는데 그건 바로 데이터에 관한 세션을 유지 하는 것이다.
클라이언트 login부분을 수정을 하였다.
withCredentials
를 추가해 주었다.
이 부분이 내가 앞서 말한 데이터에 관한 세션을 유지 하는 것이다.
cors설정만을 하게 된다면 데이터에 관한 세션을 유지가 되지 않는다.
이렇게 설정을 해주면 아마 구동도 잘되고 테스트도 잘 합격하게 될것이다.
보통은 프록시 서버에 ssl인증을 두고 사용을 한다고 한다.