2탄에서 vue의 전체적인 코드를 살펴보았다. vue에서 구현 한 것을 전체적으로 써보자면 네이버 로그인 이미지 버튼 클릭 -> naver 로그인 api 주소 호출 (여기에 클라이언트 아이디와 리다이렉트 주소, 난수를 생성하여 요청을 보냄) -> 네이버 아이디 로그인 후 리다이렉트 주소로 페이지가 이동함 -> 이때 주소의 끝에는 code와 state가 쿼리로 생성되어 있을 것이다. -> 해당 리다이렉트 주소로 오자마자 code랑 state를 가지고 토큰 생성하는 메서드 실행 -> code랑 state formData에 넣어서 axios.post로 백 단에 필요한 정보를 보냄 오늘 마지막으로 할 것은 받아온 fromData 를 이용하여 Access_Token을 발급받고, 그 토큰을 이용하여 유저의 정보를 ..

[최종 완성본] [진행 순서] 네이버 아이콘 클릭 -> 네이버 로그인 창 -> 로그인하는 순간 -> 요청 값들을 가지고 -> redirect 페이지로 이동 -> Access Token 발급 -> 토큰을 이용해서 사용자 정보 가져오기 -> 사용자 정보가 DB에 있는지 확인 -> 없다면 회원가입 -> 있다면 자동 로그인 [네이버 아이콘 클릭] @click 이벤트를 만들어 놓고 아래의 method 실행 @click="naverlogin" 메서드 naverlogin() { let client_id = "본인 client_id" let redirect_uri = encodeURIComponent("redirct_url", "UTF-8") const state = this.generateRandomState() c..