Spring-React : 카카오 소셜 로그인 + JWT (0) 전체 프로세스 알아보기

우진·2022년 4월 26일
5
post-thumbnail
post-custom-banner

(0) 전체 프로세스 알아보기

서론.

이 포스팅은 소셜 로그인의 전체 프로세스를 파악하기 위해 작성하며, 백 엔드와 프론트 엔드가 각각 나뉘어 있을 경우를 상정하여 설명한다. 도움이 되었으면 좋겠다!🥰💖


1. OAuth 란?

OAuth는 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서 사용되는, 접근 위임을 위한 개방형 표준이다.(위키백과)


쉽게 말하자면 신뢰성 있는 플랫폼 (카카오, 구글, 네이버 등)에 사용자의 보안 문제를 위탁하여 사용할 수 있게 해주는 개방형 표준이라는 뜻이다.
OAuth를 사용하면 우리의 웹 어플리케이션에서 사용자의 민감한 정보를 직접 다룰 필요가 없기 때문에 보안 문제에서 훨씬 자유로워질 수 있다.

2. OAuth 참여자


OAuth 동작에 관여하는 참여자는 크게 세 가지로 구분할 수 있다.

  • Resource Server : Client가 제어하고자 하는 자원을 보유하고 있는 서버
    + 카카오, 구글, 네이버 등이 이에 속한다.

  • Resource Owner : 자원의 소유자
    + 웹 어플리케이션을 사용하는 실제 사용자를 말한다.

  • Client : Resoure Server에 접속해서 정보를 가져오고자 하는 클라이언트
    + 웹 어플리케이션을 말한다.


3. OAuth 로그인 전체 프로세스

처음에 오해했던 것이 프론트 엔드 측에 넘겨야 하는 토큰이 발급 받은 카카오 엑세스 토큰인 줄 알았다. 하지만 넘겨야 하는 것은 날것의 엑세스 토큰이 아니라 서버에서 자체 발급한 새 토큰(JWT)이었다!! 이거 파악하는 데에 꽤 오랜시간을 소모했던 것으로 기억한다.. 😥

워낙 생소한 개념이었고, 이렇게 본격적인 팀 프로젝트를 진행해본 게 처음이어서 이래저래 시행착오가 많았다.

물론 그만큼 구현 후의 뿌듯함이 컸다. 이렇게 직접 시행착오를 겪었으니 다음번에는 더 능숙하게 구현 할 수 있을 것 같다!😆💖

profile
백 개발을 시작한 응애개발자
post-custom-banner

0개의 댓글