[OAuth]카카오 로그인 활용

gov's avatar
Dec 09, 2024
[OAuth]카카오 로그인 활용
💡

OAuth(Open Authorization)

사용자가 자신의 계정 정보를 공유하지 않고도 타사 애플리케이션이 특정 서비스에 접근할 수 있도록 허용하는 인증 및 권한 부여 프로토콜.
주로 소셜 로그인이나 API 연동에 사용

핵심 개념

리소스 소유자(Resource Owner)

  • 서비스를 이용하는 사용자
  • 자신의 데이터(리소스)에 대한 권한을 가짐

클라이언트 (Client)

  • 리소스 소유자의 데이터를 요청하려는 애플리케이션 ex) 타사 앱, 웹사이트

리소스 서버 (Resource Server)

  • 사용자의 데이터를 저장하고 있는 서버 ex) kakao API, Google Drive, Facebook API

인증 서버 (Authorization Server)

  • 사용자의 인증을 처리하고, 클라이언트에게 액세스 토큰을 발급

액세스 토큰 (Access Token)

  • 클라이언트가 리소스 서버에 접근할 수 있도록 인증 서버가 발급하는 임시 키

장점

보안성 향상

  • 사용자의 비밀번호를 클라이언트와 공유하지 않으므로, 정보 유출 위험이 줄어듦

편리성

  • 사용자는 다양한 서비스에서 동일한 계정을 사용하여 간편하게 로그인 가능

확장성

  • API를 통해 다양한 애플리케이션과 서비스를 연동 가능

동작 과정

  1. 사용자 권한 부여
      • 사용자가 클라이언트 앱이 자신의 데이터를 사용할 수 있도록 권한을 부여
  1. 권한 코드 발급
      • 클라이언트는 인증 서버에서 권한 코드를 받음
  1. 액세스 토큰 발급
      • 클라이언트는 권한 코드를 인증 서버에 보내고, 인증 서버는 클라이언트에게 액세스 토큰을 발급함
  1. 데이터 접근
      • 클라이언트는 액세스 토큰을 사용해 리소스 서버에서 데이터를 요청
  1. 리소스 제공
      • 리소스 서버는 액세스 토큰의 유효성을 검증한 후, 요청한 데이터를 제공

활용 -카카오 로그인 구현

kakao developers 홈페이지 - 카카오 로그인(회원가입으로 자동 연결)

문서 - 카카오 로그인 - 이해하기, 설정하기, RestAPI

  • 하이퍼링크를 시프트 클릭으로 따로 창 띄울것
    • 왔다 갔다 하기 편하게 하기 위함
    • 설명 읽고 설정해야해서 창 따로 안 띄우면 복잡해짐
  • 문서 카테고리에서 설명을 잘 읽고 내 애플리케이션 카테고리에서 설정 하기
    • 문서 카테고리의 이해하기, 설정하기, REST API 화면에서 설명 쭉 읽으면 설정해야할 것과 순서 다 나와있음
    • 처음에는 읽느라 시간이 좀 걸리지만 한 번 익히면 쉬워서 금방 하게 됨
notion image
 

[OAuth 구현 순서]

  1. 애플리케이션 등록
    1. 내 애플리케이션 추가하기로 c3-blog 등록
    2. notion image
      notion image
  1. 애플리케이션 설정
    1. 문서의 이해하기, 설정하기, REST API 설명 읽으면서 할 것
    2. 플랫폼 등록
      1. web 등록
      2. 사이트 도메인 http://localhost8080으로 설정
    3. 로그인 활성화 설정
    4. OpenID Connect 활성화 설정
    5. Redirect URI를 http://localhost:8080/oauth로 설정
    6. 동의 항목 체크 (닉네임)
    7. notion image
      notion image
  1. 연동 개발(RestAPI)
    1. 인가 코드 받기
      1. 문서-이해하기-REST API-쿼리 파라미터 설명 참고해서
      2. 내 애플리케이션 - 앱 설정 - 앱 키에 있는 문자열 활용
      3. 브라우저에 활용해야하기 때문에 헷갈리지 않게 밑에 작성한 양식 맞춰서 적어두기
        1. notion image
    2. 인가 코드들 한 줄로 조합해서 브라우저 창에 입력 (?와 &위치 주의) https://kauth.kakao.com/oauth/authorize?client_id=해당 키 입력&redirect_uri=http://localhost:8080/oauth&response_type=code
    3. 웹 실행 화면
      1. notion image
Share article

goho