카테고리 없음

소셜로그인(kakao) SDK vs Rest API

해갈 2023. 12. 15. 12:54

들어가며

항해99에서 실전프로젝트를 진행하며 소셜로그인 구현을 맡게 되었는데,

알아보던 중 카카오 로그인에서 SDK 와 Rest API, 두 가지 방식이 존재하는 걸 알게 되었고,

어느 방식을 고를지에 대한 고민을 작성해보려고 합니다.

 

Rest API 방식이란?

카카오 로그인의 Rest API 방식은 카카오 인가 코들르 받기 위해 쿼리 파라미터에 필수값들을 넣어 만들어진 URL 에 직접 접속 후, 리다이렉트된 페이지에서 인가 코드를 얻는 방식입니다.

여기서 핵심은 URL 에 직접 접속한다는 점입니다.

  • HTTP URI 로 리소스를 표현하고, 리소스에 대한 행위를 HTTP Method 로 정의하는 방식
  • API 의 목적이 무엇인지 쉽게 파악 가능
  • request
    • operation(ex. POST, PUT, GET, DELETE)
    • parameters(선택적)
    • endpoint(/analyze) 가 URL 이 됨
  • response
    • json, xml 과 같은 데이터 객체로 추출

 

예시 코드는 아래와 같습니다.

const KakaoLoginButton = (): JSX.Element => {
  const BASE_URL = 'https://kauth.kakao.com/oauth/authorize';

  const CLIENT_ID = 'My Kakao Client ID';
  const REDIRECT_URI = 'http://localhost:3000/kakao-login';

  return (
    <button
      onClick={() => window.open(`${BASE_URL}?client_id=${CLIENT_ID}&redirect_uri=${REDIRECT_URI}&response_type=code`)}
    >
      카카오 로그인하기
    </button>
  );
}

export default KakaoLoginButton;

 

아래는 요청 주소의 형식입니다.

https://kauth.kakao.com/oauth/authorize?client_id=(클라이언트 ID)&redirect_uri=(리다이렉트 URI)&response_type=code

 

 

SDK 방식이란?

코드상에서 불러온 자바스크립트 SDK 의 전역 카카오 객체를 사용해 로그인을 진행하는 방식입니다.

  • 디버거,  프레임워크 등 특정 플랫폼을 위한 소프트웨어 빌딩툴 또는 특정 OS 의 코드 라이브러리그룹 같은 개발도구의 집합입니다. (ex. 안드로이드, iOS SDK 등)
  • 실제로 api 를 호출해주는 메소드를 포함
  • response 또한 json 같은 형태일 필요 없음

 

예시 코드는 아래와 같습니다.

import { useEffect } from 'react';

const KakaoLoginButton = (): JSX.Element => {
  const KAKAO_JS_KEY = 'My Kakao JavaScript Key';

  const kakaoSDKLogin = () => {
    const kakao = (window as any)?.Kakao;
    const redirectUri = 'http://localhost:3000/kakao-login';

    kakao?.Auth?.authorize({
      redirectUri, // 리다이렉트 URI만 넘겨주고, 해당 주소에서 인가 코드를 받아서 처리
    });
  }

  useEffect(() => {
    const kakao = (window as any)?.Kakao;

    // 카카오 객체를 초기화 (필수)
    if (!kakao?.isInitialized()) {
      kakao?.init(KAKAO_JS_KEY);
    }
  }, []);

  return (
    <button
      onClick={kakaoSDKLogin}
    >
      카카오 로그인하기
    </button>
  );
}

export default KakaoLoginButton;

 

SDK 를 활용한 로그인 방식도, Rest API 와 똑같이 리다이렉트된 페이지에서 인가 코드를 받아서 처리하는 방식으로 동일합니다.

 

 

차이점

API 는 결과를 받아오기 위해 어떤 작업을 수행해야 하는지 알려줄 뿐 받아온 이후의 처리는 개발자의 몫인 반면, SDK 는 소프트웨어 개발을 위한 실제 코드까지 있어 SDK 가 조금 더 사용에 편리한 도구라고 할 수 있습니다. 하지만, API 가 주어진 결과를 개발자의 역량에 따라 가공할 수 있는 경우가 있을 거라고 생각합니다.

참고로 PC 에서 각 방법들을 실행할 때는 큰 차이가 없이 동일하게 동작합니다. 하지만 모바일 환경에서 보면 아래와 같습니다.

Rest API 방식 로그인 실행화면

 

Kakao SDK 방식 로그인 실행화면

Rest API : 카카오 로그인 페이지를 먼저 접속한 후, 카카오톡으로 로그인 버튼을 통해 카카오톡 앱에서 로그인을 할 수 있도록 제공합니다.

Kakao SDK : 휴대폰에 카카오톡 앱이 설치되어 있다면, 바로 카카오톡 앱을 실행해 로그인을 할 수 있도록 제공합니다. 만약 카카오톡 앱이 설치가 안되어있다면, Rest API 방식에서 본 로그인 페이지가 나타납니다.

 

결론

Android SDK, REST API 모두 카카오의 소셜 로그인인 카카오 로그인을 지원합니다.
기능상의 가장 큰 차이점은, Android SDK가 내부적으로 처리해주는 일련의 로그인 과정과 토큰 관리를 REST API는 직접 구현해야 한다는 부분인 것 같아요.

예를 들어 REST API는 인증 토큰 받기, 사용자 토큰 발급, 사용자 정보 요청을 모두 각각 구현하고 수행하도록 해야하지만 SDK 사용 시 내부적으로 이어지는 단계들을 수행합니다. 간편한 활용을 원하신다면 SDK를, 서버 중심으로 기능 구현을 하시려면 REST API를 사용하시는 걸 선택할 수 있다고 생각했고, '내일은 최저가' 프로젝트는 규모가 크지도 않고, 카카오로그인 기능에서 벗어나 다른 로직을 구현하지 않기에 사용에 편리하면 좋을 것이라고 생각해 SDK 방식을 선택하게 되었습니다.

저작자표시 (새창열림)