본문 바로가기

개발 일지/TIL

[ #39 ] TIL

✏️ 0611      


뉴스피드 프로젝트 발표

KPT 팀 회고

Spring 심화 강의


소셜 로그인

팀 과제 내용 중에서 명예 전당 쪽에 있던 내용을 바로 이렇게 배우게 될 줄은 몰랐다

그래서 오히려 더 흥미가 생기게 된 좋은 현상....

 

모든 웹 사이트에서 회원가입 과정을 거치는 것은 사용자 입장에서 매우 부담!

 

각기 다양한 웹 사이트의 아이디와 비밀번호는 보안성을 위해 다르게 설정하는게 좋다고

옛날에 권장사항으로 자주 듣던 말이었다

 

하도 많아서 어디 본인만 볼 수 있는 메모장 같은 곳에

각 사이트에 대한 아이디와 비밀번호를 적어놨어야 했었던 시절이 있었다

귀찮음이 강해 아이디와 비밀번호를 통일한다면 한 곳이 털리면 다른 곳도 털릴 수 있는 가능성 매우 증가..

 

이런 문제를 해결하기 위해서 OAuth 를 사용한 소셜 로그인이 등장한다

 

https://developer.mozilla.org/en-US/

 

요즘 어디 사이트 가입하려고 하면 항상 보이는 것들 !

 

 

OAuth 란?

 

인터넷 사용자들이 비밀번호를 제공하지 않고

다른 웹사이트 상의 자신들의 정보에 대해

웹사이트나 애플리케이션의 접근 권한을 부여할 수 있는 공통적인 수단으로서

사용되는 접근 위임을 위한 개방향 표준

 

사용자가 애플리케이션에게

모든 권한을 넘기지 않고 사용자 대신 서비스를 이용할 수 있게 해주는

HTTP 기반의 보안 프로토콜이다

 

사용자들이 타사 애플리케이션이나 웹사이트의 계정에 관한 정보를 공유할 수 있게 허용해주는 것

 

카카오 로그인의 큰 흐름

 

 

OAuth 프로세스

 

1 단계 : 액세스 요청

Anne은 YouTube(리소스)에서 자신의 Twitter 피드(서비스 제공업체)에 직접 동영상을 게시하도록 요청합니다. 그러면 YouTube에서 Twitter에 액세스 권한을 요청합니다

 

2 단계 : 토큰 및 비밀 교환 요청

Twitter에서 YouTube에 요청 토큰과 비밀을 제공합니다

 

3 단계 : 인증

YouTube에서 Anne을 Twitter에 로그인하도록 리디렉션합니다. Anne은 Twitter에 로그인 자격증명을 제공하고 YouTube의 요청이 사용자에 의해 시작되었음을 인증합니다

 

4 단계 : 액세스 토큰 교환

사용자가 요청을 인증하면 YouTube는 Twitter에 요청 토큰과 암호를 액세스 토큰으로 교환하도록 요청합니다. 토큰과 연결된 비밀이 일치하면 Twitter는 YouTube에 액세스 토큰을 제공하고 YouTube에 액세스 권한을 부여합니다

 

5 단계 : 액세스 권한 부여됨

Anne은 이제 안전하게 YouTube를 사용하여 자신의 Twitter 피드에 직접 동영상을 게시할 수 있습니다

 

출처 : https://www.entrust.com/ko/resources/learn/what-is-oauth

 

 

카카오톡 로그인 사용 승인 받기

 

이전에 네이버 검색 API 를 사용한 것 처럼

카카오 로그인을 사용하기 위해서는 카카오 개발 사이트에서 '애플리케이션 등록'이 필요하다

 

1. 회원가입 진행

 

카카오디벨로퍼스 사이트

🔺🔺🔺🔺🔺

 

위의 사이트에 접속해서 서비스 이용 동의 및 카카오톡 계정 연결을 진행한다

 

 

2. 애플리케이션 추가

 

내 애플리케이션 눌러서 애플리케이션 추가하기

 

 

3. 애플리케이션 정보 입력

 

앱 이름, 회사명, 카테고리, 서비스 이용 확인 체크 완료하고 저장

 

 

4. 플랫폼 사이트 도메인 설정

 

 

플랫폼 메뉴 선택 > Web 플랫폼 등록

 

 

http://localhost:8080 입력 후 저장

 


5. Redirect URI (callback) 설정

 

등록하러 가기 링크 클릭

 

 

카카오톡 로그인 했을 때 인가토큰을 받게 될 Redirect URI 설정하기

위에 활성화 설정도 ON 으로 바꿔줍니다

 


6. 동의항목 설정

 

카카오 서버로부터 사용자의 어떤 정보를 받을지 정할 수 있다

이건 필요한 만큼 선택하면 될 것 같고

권한없음 되어있는 항목들은 개인정보 동의항목 심사 신청을 해야 사용이 가능해진다

 

 

7. 동의항목 심사 신청 (비즈 앱 전환)

 

앱 권한 신청 메뉴에서 비즈 앱 전환을 요청해 더 많은 항목들을 사용할 수 있다

 

사업자가 아니므로.. 개인 개발자 비즈 앱 전환 클릭

 

 

내 계정은 이미 승인이 되어서 안 뜨는데

만약 처음 진행한다면 새 창으로 카카오톡 비즈니스 사이트가 나오면서

카카오톡 계정 로그인을 하라고 뜬다 진행해서 로그인하고 다시 개인 개발자 비즈 앱 전환을 누르면

 

 

요런 항목이 뜨면서 선택해서 전환할 수 있다

이메일 필수 동의를 전환해보겠다

 

 

 

전환하고 다시 동의 항목에 돌아가면

처음 비활성화 되어있던 카카오톡계정(이메일)이 사용가능한 상태로 전환된 것을 볼 수 있다

 

 

8. 카카오 서버에서 인가코드 받기

 

<button id="login-kakao-btn"
	onclick="location.href='https://kauth.kakao.com/oauth/authorize?client_id={ REST API 키 }&redirect_uri={ Redirect URI }'">
    카카오로 로그인하기
</button>

 

 

 

REST API 키는 앱 키 메뉴에서 확인할 수 있다

 

 

 

카카오 서버를 사용할 준비 끝

 

 

KPT 팀 프로젝트 회고

 

Keep

: 현재 만족하고 잘 되고 있는 것

 

팀원의 코드를 보고 칭찬과 피드백을 잘 해줘서 좋았다

개인이 각자 만든 기능이었지만 서로 잘 되는지 테스트 해보고 안되면 공유하고 고쳤던 게 좋았다

작업 후 간략하게 깃 내용을 설명하면서 PR 알림을 해주셔서 충돌이 이전보다 적어져서 좋았다


 

Problem

: 개선이 필요하다고 생각되는 것

 

깃 comment 이나 issue를 사용하지 않았던 게 아쉬웠다

개개인의 코드 특성이 강해서 공통적인 코드의 부분이 잘 나타나지 않아서 아쉬웠다


 

Try

: 잘 되는 부분을 발전하고, 문제에 대한 해결

 

코드 컨벤션을 사전에 팀원들과 충분히 이야기한 후에 작업을 진행하는 것이 좋을 것 같다

추가적인 공통된 부분이 있으면 주저않고 상의해보기

깃 활용을 적극적으로 늘려보는 연습이 필요하다 (도전하기)


 

팀장님의 블로그에는 팀원들의 KTP 를 모아두었다 ! 

다른 팀원이 되게 이쁘게 만들어주셔서 적는 내내 즐거웠던 것 같다

 

https://velog.io/@syham001/KPT-%ED%8C%80-%ED%9A%8C%EA%B3%A0

 

KPT 팀 회고

서로 맡은 바를 잘 이루어 냈고 소통도 원활히 진행하여 서로의 진행사항을 잘 알았다.코드 컨벤션이 잘 이루어지지 않아서 기능 역할 분배가 잘 이루어지지 않아서 아쉬웠다. 그리고 깃 이슈,

velog.io

'개발 일지 > TIL' 카테고리의 다른 글

[ #41 ] TIL  (0) 2024.06.13
[ #40 ] TIL  (0) 2024.06.12
[ #37 ] TIL  (0) 2024.06.07
[ #36 ] TIL  (0) 2024.06.05
[ #35 ] TIL  (0) 2024.06.04