[Firebase iOS] 휴대폰번호로 로그인하기(Authenticate with Phone Number)

안녕하세요 Foma 입니다.

 

오늘은 Firebase를 이용해서 휴대폰번호로 로그인하는법에 대해서 알아보겠습니다.

 

바로 시작할게요~

---

Xcode

가장 먼저 Signing & Capability로 이동하셔서 +Capability 버튼을 누르시고 Push Notifications를 추가시켜주세요.

 

그 다음으론 Background Modes를 추가시켜준 뒤  Remote notifications를 체크해줍니다.

 

그리곤 AppDelegate로 이동하셔서  UserNotifications와 Firebase를 import해줍니다.

didFinishLaunchingWithOptions 부분에 아래와 같이 붙여넣어주세요.

1 2 3 4

FirebaseApp.configure()          UNUserNotificationCenter.current().requestAuthorization(options: [.badge,.sound,.alert], completionHandler: { (granted,error) in }) application.registerForRemoteNotifications() Colored by Color Scripter

cs

GoogleService-info.plist에서

 

REVERSED_CLIENT_ID를 복사해주세요.

그리곤 Project의 Target으로 이동하셔서 URL Schemes에 붙여넣기 해줍니다.

---

Apple Developer

 

애플 개발자 홈페이지로 이동하셔서 Certificates,Identifiers&Profiles로 들어가주세요.

그 다음 identifiers로 이동해서 해당 프로젝트 identifier를 클릭해줍니다.

아래로 내리면 Push Notifications라고 있을거에요. 저기 보이는 Configure버튼을 클릭해줍니다.

클릭하면 아래와 같이 어쩌고 저쩌고 Certificates가 나오는데 여기서 Development SSL Certificate를 Create해줍니다.

그러면 다음과 같은 화면에서 Choose File이 보이실거에요 클릭해줍니다!

---

Keychain Access

여기서 KeyChain Access앱을 켜주세요. 

키체인 접근 - 인증서지원 - 인증 기관에서 인증서 요청을 눌러줍니다.

그러면 아래와 같이 화면이 뜰텐데 자신의 이메일주소를 입력해주고 디스크 저장됨을 선택하고 계속을 눌러주세요.

 

그러면 파일은 자신이 원하는 곳에 잘 저장해둡니다.

그러면 이와 같은 파일이 저장될건데 이제 다시 Apple Developer 홈페이지로 이동해서 아까 Choose Files에 이것을 넣어줍니다.

 

그리곤 생성한 SSL Certificate 파일을 Download 눌러주시면

 

아래와 같은 파일이 다운로드 될거에요. 이제 이 파일을 클릭해줍니다.

키체인 액세스가 뜨면서 내 인증서에서 자시의 프로젝트 인증서가 발급된걸 볼 수 있을거에요.

여기서 오른쪽 마우스를 클릭해서 App Development ~~~ 내보내기를 눌러주세요.

내보낼때 원하는 비밀번호를 정해주세요.(나중에 Firebase Console에서 사용하셔야 합니다.)

그러면 아래와 같이 .p12 파일이 생성됐을거에요.



---

Firebase Console

 

이제 파이어베이스 콘솔로 이동해줍니다.

 

프로젝트의 세팅으로 이동해주세요.

 

설정의 클라우드 메시징 탭을 들어간 뒤

아래로 내리면 APN 인증서에서 개발 APN인증서를 업로드 버튼을 누르고 아까 저장해준 .p12파일을 업로드 해줍니다.

아까 설정하신 비밀번호를 입력해주세요.

 

그 다음 Authentication으로 이동해서 전화 로그인 사용설정을 해줍니다.

---

Xcode

 

다시 Xcode로 이동하셔서 원하는 휴대폰 로그인 UI를 만들어주시고

 

해당 뷰컨트롤러에 FirebaseAuth를 import해줍니다.

텍스트필드와 버튼을 연결시켜줍니다.

그리고 나중에 폰번호 인증을 할때 받데될 verifyID를 저장할 변수를 하나 만들어줍니다.

문자메세지를 보내

는 부분은 PhoneAuthProvide.provider().verifyPhoneNumber(핸드폰번호,uiDelegate:nil)를 써주시고 

 

error가 nil일때 아까 만들어줬던 verifyID를 varification 값으로 설정해줍니다.

인증코드를 확인하는 부분은 

 

PhoneAuthProvide.provider().credential(withVerificationID:verifyID,verificationCode:문자메세지코드)를 credential을 만들고

 

Auth.auth().signIn에 credential을 넣어줍니다.

아래와 같이 Send버튼을 눌러주면

구글에서 인증코드가 날라옵니다.

구글에서 온 코드를 입력해주고 Done버튼을 눌러주면

파이어베이스 결과가 출력되고 성공적으로 유저가 로그인할 수 있게됩니다!!