클론코딩 4일차

전 프로젝트와 동일하게 로그인을 한후 어떤 api요청을 보낼떄 헤더값에 토큰이 전달되지않는 현상이 발생했다. 이게 매번 들어가지않는것이아닌, 들어갈떄도있고 들어가지 않을떄도 있어서 왜 이런 현상이 발생하는지 원인은 모르겠지만, axios 인터셉터를 활용하여, 요청을 보내기직전에 header에서 auth에 토큰값을 넣어주어서 해결할 수있었다. 인터셉터의 쓰임새를 체험해볼수 있었다. 추가적인 오류는 전체적인 어플리케이션이 만들어지고 여러가지 동작을 실행해봐야 알수있겠지만, 한개는 넘겼다. 다음으로 도전해봤던건 소셜로그인중 카카오 로그인을 구현했다. 카카오데브 사이트에 구현방법이 상세히나와있었고, 구글링을통해 사용방법을 익혔다. 리다이렉션이라는 개념이 좀 헷갈리긴했는데 단순히 요청을 보낼떄 서버에서 해당경로로 이동시켜주는거라고 이해했다. 거기서 카카오는 클라이언트단에 인증코드를 보내주고 그 인증코드를 가지고 서버단에 토큰을 요청하면, 서버는 인증코드를 받아 카카오에 토큰을 요청한다. 이후 서버는 토큰을받으면서 회원정보를 검사하고 클라이언트에게 토큰을 전달해주는 방식이다. 발생했던문제점으로는 인증코드를 카카오로부터 받고 우리 서버단에 토큰을 요청하는 단계에서 문제가 발생했다. 500번대 에러가 발생했었는데, 서버측의 말에의하면 서버단에서 카카오로 요청을보낼떄 json방식이아닌 다른방식(application/x-www-form-urlencoded)으로 보내야한다고하여 프론트단에서부터 그방식으로 보내야하는 의문이 생겨 header에서 content-type를 바꿔서 보내려는데 개발자도구에서 network의 요청에서 변경된 content-type이아니라 에초에 헤더에 content-type항목이 존재하지가않는다..그렇게계속 변경시켜 보내려는 방법을 찾고있던중 서버측에서 카카오에 요청을보내는과정에서 코드에러를 찾아 수정하여 토큰을정상적으로 받아왔고, 프론트단에서의 content-type문제가 아니였다.. 뭐 아무튼 문제는해결됬는데 왜 요청헤더에 content-type가 찍히지 않았는지는 의문이다. 그렇게 카카오 로그인을 구현할 수있었다. 로그인중 동의사항을 설정해줄수있었는데 이를통해 원하는 개인정보를 우리가 구현한 웹사이트에서 사용할 수있게되었다.