[개발 진행] 카카오 로그인 해결(with cors 에러)

 

마지막 포스팅이 끝나고 시험기간에 들어가서 그런지 굉장히 오랜만에 작성하는 것 같다.

뭐.. 얼추 마무리가 되었으니 카카오 로그인에서 cors에러가 나는것을 해결한방법을 정리해 보고 총 정리 식으로

작성해 봐야겠다. 

 

그래도 시간이 좀 지났다고 생각이 살짝 흐릿한 걸 보면 역시 기록은 참 중요한 것 같다ㅜㅜ

현재는 로그인 할때 cors오류가 나지않는다. 해결했을때 어찌나 기쁘던지.....

 

해결 방법을 찾다가 라이브러리를 발견하고 적용시키니 로그인이 문제없이 넘어갔다.

(사실 발견한건 좀 됐는데 그당시에는 vue코드를 보는 실력이 없어서 적용을 못했다는 말이 더 맞을것이다.)

https://www.npmjs.com/package/vue-kakao-login

vue-kakao-login

해당 라이브러리를 사용해서 카카오 로그인을 이용하는데, 더이상 에러가 나지않는다.

다만 이 라이브러리는 로그인 기능만을 지원해 주기 때문에 로그아웃 기능이랑 unlink하는 기능은 구현하기가 어려웠다.

그래서 생각한 방식이 해당 라이브러리 코드를 보고 직접 내 소스안에는 같은 방식으로 로그아웃을 구현하려고 했으나,

자꾸 오류가 떠서 이 기능은 미완성이다ㅜㅜ. 

 

사용법은 간단하다. 라이브러리에 사용방법 그대로 적용하면 된다.

 

[ 로그인 화면]

로그인 화면

더이상 cors에러가 나지 않고, 정상 작동한다. 

 

 

우리 프로젝트 서버를 이용하면서도 cors 오류는 종종 났다.

결론은 이 에러를 잡는건 서버쪽에서 해결하는것이 가장 편하다이다.

 

물론 프론트 쪽에서 우회하는 방법이 분명 있겠지만 아직은 내실력이 그것을 다 이해하는 것이 어려웠다ㅜ

해결방법을 이해해서 적용하다기 보단 제시된방법을 적용시키기 급급했기때문에..  

앞으로 웹쪽으로 진로를 잡게된다면 이 에러를 무수히 보게될테니 차분히 이해를 해가다보면 분명 언젠가 이 에러를 완별히 이해할날이 올것이다. 그땐 꼭 기록해서 나처럼 누군가에게 도움이 됐으면 좋겠다.

 

 

 

[여기는 내 kakao-login 소스 코드]

https://github.com/anji314/Today_Project/blob/master/src/components/Login_service/kakao_login.vue

anji314/Today_Project