Firemonkey의 Android/iOS 환경에서 네이버 OAuth2.0 을 이용한 로그인

Firemonkey (Delphi) 의 Android/iOS 에서 Naver OAuth2.0 을 이용하여 사용자 정보를 가져오는 순서이다.

'② code 전달' 에 사용되는  redirect_uri 는 네이버에서 code를 전달할 때 사용되는 주소이며, 보통 'http://www.sample.com/oauth' 혹은 'https://www.sample.com/oauth' 등으로 표시된다. 웹서버를 만들어서 해당 폴더를 생성 한 후 index.html 등을 만들어 넣으면 된다.

지금은, TWebBrowser 에서 DidFinishLoad( ) 함수를 이용하여, 직접 code 값을 추출할 것이므로, index.html 안에서는 특별한 작업을 할 필요가 없다. (redirect_uri 이 서버단에서 code를 받아서, 다른 작업을 할 필요가 있을 경우에는 PHP, javascript 혹은 델파이의 RESTBroker 를 만들어 사용하면 된다)

 

1. 네이버 개발자센터에서 Application 을 등록한다

'애플리케이션 이름' 입력 후 '사용자 API' 에서 '네이버 로그인'을 선택한다.

'사용 API'에는 가져오고 싶은 정보를 선택하면 된다.

'서비스 URL'은 홈페이지 주소를 입력하고, Callback URL 에는 callback 을 받을 redirect URL 을 적어주면 된다. 여기서는 개발 테스트를 하는 것이므로,  'http://localhost/oauth'를 입력하였다. 실제 개발을 위해서는 웹서버를 구축한 후 그 주소를 적어 주어야 한다. 

서비스 이용 동의를 모두 체크한 후 '등록하기' 버튼을 선택하면 어플리케이션이 '개발 중' 상태로 등록된다.

등록이 되면, 'Client ID' 와 'Client Secret' 를 확인할 수 있으며, 이 두 정보는 앱에서 '네이버 로그인' 연동 시 필요하다.

 

이 상태에서는 네이버 개발자센터에 로그인 한 네이버 아이디로 로그인 테스트 할 수 있으며, 다른 테스트용 네이버 아이디를 추가하려면 '멤버관리'로 들어가면 된다.

 

2. Firemonkey (Delphi) 에서 OAuth2.0 을 이용하여 네이버 로그인 연동하기

TabControl 에  tabMain, tabBrower 이 두개의 TTabItem 을 추가하고, tabMain 에는 네이버 연동에 필요한 control 을 위치 시켰고, tabBrowser 에는 TWebBrowser 을 추가 하였다.

TTimer 인 timerLogin 를 사용한 이유는, 네이버 서버에 code 값을 요청 했을 때, 사용자가 네이버에 로그인 되지 않았을 경우에는 로그인 창이 보이지만, 이미 로그인 되어 있을 경우에는 code 값 요청 시 전달한 redirect_uri 로 바로 이동하기 때문에 tabBrowser 의 내용을 보여줄 필요가 없기 때문이다.
timerLogin 의 interval 은 1000(1초) 로 설정했고, code 요청 후 1초안에 redirect_uri 가 TWebBrowser 의 OnDidFinishLoad() 에 전달되지 않으면, 네이버 로그인 창이 나타나 것으로로 간주하여, timerLogin 이 tabBrowser 를 보여주게 된다.

추후 로그인 절차가 끝나서, OnDidFinishLoad() 이벤트 함수에 code 가 전달되면,  tabMain 이 자동으로 보여지게 만들었다.

1) connect

WebBrowser 를 이용하여 코드를 요청한다. 이때 client_id 와 redirect_uri 는 네이버 개발자 센터에 등록된 것을 사용한다.

 

2) code 추출

TWebBrowser 의 OnDidFinishLoad() 이벤트 함수에서 응답받은 URL 을 분석하여,  code 를 추출한다. 추출한 code는 TEdit 인 edtCode.Text 에 저장한다. code 를 받았다는 것은 로그인이 완료되었다는 것이므로, tabMain 으로 화면을 이동한다.

 

3) token 추출

TRESTClient, TRESTRequest, TRESTResponse 를 이용하여, token 을 받아온다. 받아온 token 은 TEdit 인 edtToken.Text 에 저장한다.

 

4) 사용자 정보 가져오기

RestRequest1.Method := rmGet 인 것에 주의한다. 위와 같이 원하는 값을 추출 한다.

Response 로 들어오는 내용은 JSON 형태이므로, 위 소스와 같이 값을 추출하면 되며,  기본값으로 사용자 'id' 값이 전달된다. 이 id 값을 사용자 등록 시 같이 저장하면, 네이버 로그인 연동 시, 신규회원 등록이 필요한지, 그냥 로그인만 하면 되는지 판단할 수 있다.

 

5) Logout
네이버에 한번 로그인 하게되면, 일정한 시간이 지나 자동 로그아웃 되기전까지는 로그인 창을 테스트 할 수 없다. 그래서, Logout 을 통해, 네이버 로그아웃을 할 수 있게 하였다. logout 은 token 값을 받아야 사용할 수 있다.

 

6) 소스파일

OAuth20Unit.zip

0.00MB