엑스바스

자료실

Photon 클라우드 - Facebook을 이용한 커스텀 인증

작성자 | admin

2021-03-15 |

Photon Cloud(포톤 클라우드) - Facebook을 이용한 커스텀 인증

이 튜토리얼에서는 Photon 클라우드 어플리케이션이 Photon 커스텀 어플리케이션을 이용하여 페이스북 계정으로 어떻게 인증을 받는지에 대하여 설명 합니다.

개요

Photon 클라우드 커스텀 인증은 사용자 인증을 체크하기 위해서 외부 서비스(인증 프로바이더) 호출을 포함하고 있습니다. 인증에 대한 전체 흐름에 대해서는 일반문서를 참고 하시기 바랍니다.

일반적으로 인증을 받기 위해 서비스에 따라 인증을 체크 하기 위한 몇 개의 파라미터들이 필요 합니다. 정적 파라미터들은 Photon 클라우드 어플리케이션 환경설정에서 값이 설정되며 동적 파라미터들은 Photon 클라우드 자바스크립트 클라이언트 API를 호출할 때 전달됩니다. 이 튜토리얼은 클라이언트 측에서 페이스북 로그인 플러그인을 사용 합니다. 이 플러그인을 통해 사용자의 페이스북 토큰과 인증 프로바이더를 얻게 됩니다. https://customauth.photonengine.com/facebook 인증 프로바이더는 마스터 서버측에서 온 토큰의 유효성을 체크 합니다. 페이스북 인증에 대해서 인증 프로바이더는 appid, secret 과 token 파라미터가 필요 하고, 주어진 토큰이 페이스북의 appid 에서 어플리케이션이 유효한지 체크 합니다.

구현

기존 어플리케이션의 커스텀 인증을 할 수 있도록 설정하는 것은 간단히 몇 단계만 거치면 됩니다:

1. 페이스북 App 설정

자세한 페이스북 App 설정에 대해서는 페이스북 레퍼런스 문서를 보시기 바랍니다. 이 튜토리얼에서 필요 한 것은 Facebook App ID 과 App Secret 입니다. 페이스북 앱 설정에 대해서는 페이스북 문서를 참고 하세요.

2. Photon 클라우드 어플리케이션

Photon 클라우드 대시보드에서 어플리케이션의 상세(Details)페이지로 이동 하세요. 커스텀 인증 섹션을 펼칩니다. 페이스북 인증에 대한 Authentication URL은 Exit Games 가 설정 해 놓았습니다. 아래 두개 파라미터의 값을 설정 해주세요:
appid = Facebook App ID secret = Facebook App Secret
변경사항을 저장 합니다.

3. HTML5 / JavaScript 클라이언트

클라이언트는 페이스북 로그인 버튼을 div 태그를 이용하여 html document body 내 원하는 곳에 추가 합니다.
Code Example C#:

페이스북 JavaScript SDK 로딩 ,페이스북 로그인 버튼 생성과 페이스북 인증 상태 처리에 대한 코드를 추가 합니다. 태그 바로 밑에 위치시키는 것이 이상적 입니다.

Code Example C#:

위 코드는 페이스북 JavaScript SDK 를 비동기적으로 로드 하고 페이스북 로그인 버튼을 생성합니다. window.fbAsyncInit 함수는 로딩이 완료 된 직후 호출 됩니다. 내부 코드에서는 페이스북 auth.authResponseChange 이벤트 핸들러를 subscribe 하고 있으며 사용자의 페이스북 로그인 성공 이후 response.status = "connected" 정보와 같이 작동 됩니다. 사용자의 토큰은 파라미터로 이 핸들러에게 전달 됩니다. 이 토큰을 통해 핸들러는 Loadbalancing 클라이언트의 커스텀 인증 모드를 설정하고 인증 URL 로 추가적인 파라미터 토큰을 추가 합니다. 그리고 나서 핸들러는 마스터 서버로 접속을 시작 합니다.

4. 디플로이 및 실행

HTML5 / JavaScript 클라이언트 코드는 페이스북 앱 설정에서 지정된 App Domain에 위치 시키도록 합니다. 이렇게 해야 페이스북 로그인 버튼의 기능이 올바르게 동작하게 됩니다.
사용자의 어플리케이션 페이지 접속은 페이스북 로그인 버튼을 눌러 사용자명과 암호가 입력된 이후 Photon 클라우드로 로그인을 할 것 입니다. 페이스북에 이미 로그인 되어 있었다면 즉시 Photon 클라우드에 로그인 될 것 입니다.

출처 : Exit Games Photon 사이트

* 표시는 필수 입력 사항






파일첨부 첨부파일은 문서 또는 이미지 파일 (pdf, hwp, txt, doc, docx, ppt, pptx, xls, xlsx, jpg, gif, bmp, png, zip)만 첨부가능합니다. 첨부파일의 용량은 50MB 이하로만 등록 가능합니다.
자동입력 방지문자

Photon Cloud(포톤 클라우드) - Facebook을 이용한 커스텀 인증

개요

구현

1. 페이스북 App 설정

2. Photon 클라우드 어플리케이션

3. HTML5 / JavaScript 클라이언트

4. 디플로이 및 실행

1:1 문의하기