[KISA 핀테크 기술지원센터] 기술세미나 :: 구글 로그인 연동으로 배우는 OAuth 인증 - 1
일시 : 2019.05.14 (화) 16:00 - 2019.05.15 (수) 18:00
강사 : 생활코딩 이고잉님
OAuth가 왜 필요할까?
- Access Token이라는 제한된 권한을 사용할 수 있는 임시비밀번호를 발급해줌 (보안상 안전)
- 과정을 자동화 해 줌 (사용자 모르게)
OAuth 전에는..
사용자로부터 구글이나 페이스북의 아이디와 비밀번호를 받는다.
그것을 데이터베이스에 따로 저장해둠.
이 방식은 심플하지만 단점이 있음.
Resource Owner (사용자) 입장 : 누군지도 모르는 서비스에게 ID와 PWD를 알려줘야함
Resource Server (구글, 페북..) 입장 : 누군지도 모르는 Client에게 ID와 PWD를 알려줘야함
너무 위험하다.
OAuth를 통한 해결
권한에 해당하는 임시 비밀번호 발급 => Access Token
사용자는 내부적으로 Access Token으로 사용한다는 사실을 알지못함.
자동으로 Access Token에 대한 정보를 Client에게 전달
실습 목표
- 인증하기
- API 접속후 뭐 하나 해보자
실습 순서
- widget 방식 : 쉽다, 자유롭지X, 보안상 안전
- raw 방식 (직접 만드는) : 쉽다, 자유로움, 안전을 획득하기 어렵다
- library 방식 : 어렵다, 자유로움, 완전 안전
Web Server for Chrome 설치
- 간단한 웹 서버
# widget 방식 실습
'Web Server for Chrome' 실행 후 'CHOOSE FOLDER' 지정
지정한 폴더안에 widget.html 생성 후 구글 OAuth widget 내용을 복사 붙여넣기
https://console.cloud.google.com을 통해 OAuth연동을 한 뒤
widget.html의 content 부분을 클라우드의 client_id로 바꿈
client_id : 사업자 등록번호, 노출되도 상관 X
client_secret : 공인인증서, 절대로 노출되면 X
너무 간단함.
# raw 방식 실습
OAuth 2.0 for Client-side Web Applications에서 메뉴얼 확인
구글 캘린더를 사용하기 위해 구글에게 허락을 받아보자!
- Google Cloud Platform - 라이브러리 - Google Calendar API
JS 클라이언트 라이브러리 : 라이브러리를 사용할 경우
OAUTH 2.0 엔드 포인트 : raw 레벨로 직접 구현할 경우
raw.html 페이지 생성
메뉴얼 step 2 샘플 복사
https://accounts.google.com/o/oauth2/v2/auth?
scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fdrive.metadata.readonly&
include_granted_scopes=true&
state=state_parameter_passthrough_value&
redirect_uri=http%3A%2F%2Foauth2.example.com%2Fcallback&
response_type=token&
client_id=client_idscope : 사용할 기능의 일부
redirect_uri : Access Token을 어디로 받을것인가
구글 캘린더의 scope는 뭐가 있을까?
주소를 붙여넣을 때는 인코딩 작업을 거친 URL을 copy해야 한다.
- 개발자 도구에서 encodeURIComponent('https://www.googleapis.com/auth/calendar'); 입력
- 인코딩 된 URL : "https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fcalendar"
- Client_id는 인코딩을 하지 않아도 된다. (하나 안하나 결과는 같음)
수정한 raw.html은 다음과 같다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<a href="https://accounts.google.com/o/oauth2/v2/auth?scope=https%3A%2F%2Fwww.googleapis.com%2Fauth%2Fcalendar&include_granted_scopes=true&state=state_parameter_passthrough_value&redirect_uri=http%3A%2F%2Flocalhost%3A8887%2Fraw_callback.html&response_type=token&client_id=898088711348-0bg7rc6abjssqiitkecq50tmnmq65ls0.apps.googleusercontent.com">Login for Google</a>
</body>
</html>Access Token을 배달받은 http://localhost:8887/raw_callback.html 주소를 Google Cloud Platform에 등록해준다.
실제 실행을 해보면 url에 Access Token이 발급된 것을 확인할 수 있다.
*주의! ) *실습은 http로 진행되지만 실제 서비스를 운영할 때는 https로 사용하여야 한다.
'세미나' 카테고리의 다른 글
| [기술교육] JPA 트러블 슈팅 - 1편 (1) | 2023.03.14 |
|---|---|
| if Kakao dev 2020 - 카카오 대 장애 회고 정리 (2) | 2022.12.07 |
| 코드리뷰 노하우 (0) | 2022.08.12 |
| 구글 로그인 연동으로 배우는 OAuth 인증 - 2 (0) | 2019.05.15 |
| 카카오 세미나 (0) | 2019.03.05 |
댓글