애플 로그인 (Sign In with Apple)

안녕하세요. 그린입니다🟢

이번 포스팅에서는 iOS에서 애플 로그인을 연동시키는 학습을 해보겠습니다🙋🏻

 

애플 로그인?

여러 앱을 보면 소셜 로그인(카카오, 구글, 네이버)등을 연동하여 해당 소셜 계정으로 앱을 로그인 할 수 있도록 지원하고 있습니다.

그런데 2019년에 애플이 동일하게 애플 계정으로 다른 앱을 로그인할 수 있는 기능을 만들었어요.

더군다나 우리의 애플은 다른 소셜 로그인을 붙인다면 꼭 애플 로그인도 붙여야된다고 권장 아닌 권고를 합니다!

그래서 애플 로그인을 꼭 붙여야하는 상황이니 알아보시죠!

 

애플 로그인 최소 OS 지원

애플 로그인은 iOS에서는 13.0 이상 버전에서만 Sign In With Apple 기능 구현을 사용할 수 있으니 참고해주세요.

그 밑 버전들은 해당 문서를 참고해보시면 될것 같습니다!

https://developer.apple.com/documentation/sign_in_with_apple/sign_in_with_apple_js/incorporating_sign_in_with_apple_into_other_platforms

Apple Developer Documentation

 

애플 로그인 구현하기

1. Apple Developer에서 App ID 설정

https://developer.apple.com/account/#!/welcome

로그인 - Apple

요 사이트에서 Certificates, Identifiers & Profiles로 갑니다.

그 다음 Identifiers로 가서 새로 추가해줍니다.

App IDs로 선택해주고 Continue 해줍니다.

Bundle ID와 Description을 넣어주는데요.

여기서 번들 아이디는 애플 로그인을 붙여주기 위해 만들어준 앱의 Bundle Identifier로 지정해줍니다.

많은 항목 Capabilities 항목중에서 아래로 내려 Sign In With Apple 항목을 선택하고 저장해줍니다.

 

이렇게 되면 우선적으로 Identifier 설정은 끝났습니다.

이제 앱에서 설정을 해보도록 하죠!

 

2.  Capabilities 추가

앱 타겟에서 Signing&Capabilities로 갑니다.

여기서 좌측 상단 + 버튼을 눌러 Sign in with Apple 항목을 추가해요.

이러면 초기 설정은 끝!

다만 중요한건 저기서 Team ID를 꼭 1번에서 애플 로그인 Capabilities를 허용한 ID로 지정해둬야지 나타납니다!

 

3. Apple 로그인 버튼 추가

여기부터는 애플 공식 문서에 따라 커스텀하게가 아닌 나와있는데로 이해해보겠습니다🙌

애플에서 로그인 버튼을 공식적으로 만들어서 지원하기에 커스텀하게 사용할 이유는 크게 없을것 같긴합니다.

func setupProviderLoginView() {
  let authorizationButton = ASAuthorizationAppleIDButton()
  authorizationButton.addTarget(self, action: #selector(handleAuthorizationAppleIDButtonPress), for: .touchUpInside)
  self.loginProviderStackView.addArrangedSubview(authorizationButton)
}

ASAuthorizationAppleIDButton 객체를 만들어줍니다.

이 객체를 생성할때 type과 style을 줄 수 있어요.

버튼 type으로는 continue, default, signUp, signIn이 올 수 있습니다.

default는 signIn의 타입으로 들어가요.

즉 이 버튼으로 어떤 액션을 해줄건지의 타입이겠죠?

style로는 black, white, whiteOutline 3가지가 있습니다.

각각의 차이는 배경에 따라 뷰의 테마에 따라 달라질 수 있을것 같아요!

https://developer.apple.com/design/human-interface-guidelines/sign-in-with-apple/overview/buttons/

Buttons - Sign in with Apple - Human Interface Guidelines - Apple Developer

해당 H.I.G에 그 차이가 잘 나와있습니다.

Black

White

WhitIOutline

스토리보드에서 애플 로그인 버튼을 추가할때는 Xcode의 Identity Inspector에서 컨트롤의 클래스 값을 ASAuthorizationAppleIDButton로 설정 해줘야 한다고 해요!

 

4. Apple ID 승인 요청

@objc
func handleAuthorizationAppleIDButtonPress() {
  let appleIDProvider = ASAuthorizationAppleIDProvider()
  let request = appleIDProvider.createRequest()
  request.requestedScopes = [.fullName, .email]
    
  let authorizationController = ASAuthorizationController(authorizationRequests: [request])
  authorizationController.delegate = self
  authorizationController.presentationContextProvider = self
  authorizationController.performRequests()
}

ASAuthorizationAppleIDProvier 인스턴스를 만들어 해당 리퀘스트 항목을 넣어줍니다.

애플에서 제공받을 수 있도록 요청할 수 있는건 딱 2개입니다.

이름과 이메일! (폐쇄적 애플...)

이렇게 설정하고 ASAuthorizationController에 해당 프로바이더를 담아 진행되도록 구성해줍니다.

중요한건 애플로 로그인 시 이중 인증을 활성화해야합니다.

뭐 요런거 다들 많이 보셨죠?

 

5. 사용자 인증 후 처리

func authorizationController(controller: ASAuthorizationController, didCompleteWithAuthorization authorization: ASAuthorization) {
  switch authorization.credential {
  case let appleIDCredential as ASAuthorizationAppleIDCredential:
    let userIdentifier = appleIDCredential.user
    let fullName = appleIDCredential.fullName
    let email = appleIDCredential.email
    
  case let passwordCredential as ASPasswordCredential:
    let username = passwordCredential.user
    let password = passwordCredential.password
  
  default:
    break
  }
}

인증 여부에 따라 이러한 처리들을 해줄 수 있어요.

ASAuthorizationAppleIDCredential은 비밀번호 및 페이스ID 인증 같은 경우를 통해 왔을때고

ASPasswordCrendential은 iCloud의 패스워드를 연동해서 왔을때로 분기가 됩니다.

이렇게 받아온 인증 값들을 알아서 모델 및 데이터로 처리해주는 코드를 작성하면 되요🙋🏻

 

6. 사용자 인증 실패 시

func authorizationController(controller: ASAuthorizationController, didCompleteWithError error: Error) {
  // Handle error.
}

해당 메서드를 이용해 인증 실패 시 처리를 해주면 됩니다!

 

앱 시작 시 애플 사용자 자격 증명 확인

앱을 시작할때 연동해 로그인 증명을 했는지 알 수 있습니다.

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
  let appleIDProvider = ASAuthorizationAppleIDProvider()
  appleIDProvider.getCredentialState(forUserID: KeychainItem.currentUserIdentifier) { (credentialState, error) in
    switch credentialState {
    case .authorized:
      // Authorization Logic
    case .revoked, .notFound:
      // Not Authorization Logic
      DispatchQueue.main.async {
        self.window?.rootViewController?.showLoginViewController()
      }
    default:
      break
    }
  }
  return true
}

요렇게 application didFinishLaunchingWithOptions일 때 분기 처리해줘서 구현을 해줄 수 도 있습니다!

 

Personal Team일 때 팀원들을 추가하여 Bundle Identifier를 동일하게 사용하기

팀계정으로 만드는게 아닌 개인 여러명이 모여 작업을 할 경우 TEAM ID와 bundle ID때문에 각자 충돌이 나게되고 테스트를 정상적으로 할 수 없게 될 경우가 많습니다.

이에 한명이 애플 개발자 계정으로 디벨로퍼 신청을 하고 사용하고 있다면 personal Team으로 다른 팀원들을 초대할 수 있습니다.

Apple Developer 사이트에서 People로 간다음 팀원들의 애플 계정을 초대한다면 다른 팀원들도 엑코에서 해당 초대한 계정이 타깃에서 team에 나타나게됩니다.

https://appstoreconnect.apple.com/access/users

https://appstoreconnect.apple.com/login?targetUrl=%2Faccess%2Fusers&authResult=FAILED

그렇게 되면 동일한 bundle ID와 Team으로 정상적인 테스트가 가능하겠습니다!

 

마무리

애플 로그인을 알아봤는데 복잡해 보이면서도 따라만 한다면 아주 쉽습니다.

애플 로그인을 통해 얻는게 많은지는 확실히 잘은 모르겠으나?

꼭 필요한것이니 타 소셜 로그인을 사용하기 위해서는 꼭 알고 있어야 될것 같아요!

치사한 애플...

 

[참고자료]

https://developer.apple.com/documentation/authenticationservices/implementing_user_authentication_with_sign_in_with_apple

Apple Developer Documentation