SwiftUI | Firebase Github Login

 

 

 

 

 

이번 프로젝트는 github에서 사용자 정보를 가져와서 사용하고, 보여주어야 하기 때문에 GitHub를 연동하여 로그인할 수 있도록 구현하는 게 필수요소인데, 로그인은 됐는데 404 화면이 뜬다거나, 이상한 화면이 확인된다거나... 하는 문제에 대해 자료를 찾는 게 어려워서 한참 헤맸던 것 같다. 

 

 

GitHub 사용자 정보를 가져오기 위해 먼저 Firebase Authentication 기능이 필요한데, Firebase에 사용할 프로젝트를 생성하고 Authentication에서 로그인 제공 업체를 선택해주어야 한다.

Firebase Authentication - 로그인 방법 → 로그인 제공업체

 

 

위 사진과 같이 경로를 이동한 후 새 공급업체 추가를 클릭하면

Firebase Authentication - 새 공급업체 추가

 

 

Firebase에서 지원하는 로그인 제공업체를 선택할 수 있는 창이 팝업 된다. 여기서 GitHub를 선택해 주면 된다. 

GitHub 로그인 사용 설정

 

그럼 클라이언트 ID, 클라이언트 보안 비밀번호를 입력하라는 화면이 확인되는데, 여기를 입력하기 위해서는 먼저 GitHub에서 설정을 해줘야 한다. 

 

 

 

GitHub 경로 

Settings → Developer Settings → OAuth Apps → New OAuth App 클릭 

GitHub - New OAuth App

 

위 경로대로 이동하면 사진과 같은 화면이 확인되는데, 여기 프로젝트 정보를 입력해주면 된다. 나는 홈페이지 URL이 없기 때문에 Firebase의 승인 콜백 URL의 일부를 입력해 주었고, Authorization callback URL은 일단 Firebase의 승인 콜백 URL 전체를 입력했다. 

 

 

입력을 다 했다면 Register appliction을 클릭한 후 클라이언트 ID, 클라이언트 보안 비밀번호를 확인해서 Firebase에서 GitHub 로그인 사용 설정 창 빈칸을 채워주면 된다. 

 

 

여기까지 했으면 거의 다 한 건데, 이제 내 프로젝트를 Xcode에서 열어서 

 

 

 

경로

AppName.xcodeproj → Targets → Info → URL Types

 

 

위 경로를 찾아가 플러스 버튼을 눌러 아이템을 추가해주면 된다. 

 

 

 

그 후 위와 같은 형식으로 URL Schemes를 입력하고 GitHub에 Authorization callback URL에서 myapp:// 이런 식으로 변경해 주면 된다.

 

 

예시 

URL Schemes : nameApp 
Authorization callback URL : nameApp://

 

 

이렇게 하면 이제 내 프로젝트에서 GitHub 로그인을 진행할 수 있게 된다. 

 

 

 

 

 

* 위 URL Schemes와 Authorization callback URL의 형식이 잘못되었을 경우 아래와 같은 화면을 확인하게 될 지도 모르니 주의하자. 

Unable to process request due to missing initial state. This may happen if browser sessionStorage is inaccessible or accidentally cleared. Some specific scenarios are - 1) Using IDP - Initiated SAML SSO 2) Using signInWithRedirect in a storage-partitioned browser environment.