Ionic으로 개발하던 앱에서 Facebook 로그인을 추가하기로 했고,
구현을 위해 관련된 자료를 찾던 중에 ngCordovaOauth 플러그인을 찾았다.
Ionic 포럼에서는 이 플러그인을 소개하는 글이 있었고, 이 플러그인을 이용한 샘플 프로젝트도 안내하고 있었다.
참고로 개발 환경에서 테스트해보려면 브라우저말고 에뮬레이터를 써야 한다.
우선 페이스북 개발자센터의 상단 네비게이션 > MyApp에서 앱을 생성한다.
블러 처리된 부분의 App ID를 복사 한다.
샘플 프로젝트의 www/js/app.js 파일에서 아래의 코드를 찾아 client_id를 복사해둔 APP ID로 바꾼다.
$cordovaOauth.facebook("client_id", ["email", "read_stream", "user_website", "user_location", "user_relationships"]).then(function(..){...});그리고 에뮬레이터에서 테스트 해보면 에러가 난다.
다시 페이스북 개발자센터로 간다.
MyApp > Settings의 Advanced 탭으로 이동한다.
그림에 표시된 부분에 "http://localhost/callback"을 입력한 후 다시 실행한다.
로그인에 성공했다.
하지만 이 방법은 페이스북 개발자 센터에서 APP을 생성한 계정으로만 가능할 뿐, 다른 팀원의 계정으로 로그인을 시도하면 에러가 발생했다.
화면에 표시된 toggle 버튼을 클릭해서 Yes 상태로 만든다.
그럼 다른 계정으로도 테스트 가능.