react native 애플로그인 typeerror

요즘은 꽁술을 앱으로 만드는 과정을 진행 중이다.

꽁술은 웹으로 잘 만들어져 있는데,
https://app.ggongsul.net
그냥 웹뷰로 감싸서 올리니 문제가 발생했다. 바로 카카오로그인 때문이다.

웹뷰를 띄운 상태에서 카카오로그인을 누르면 새로운 웹이 뜨면서 그때 이후부터는 안드로메다로 가버린다.
이것을 해결하기 위해 많은 글들을 찾아보고 시도를 해보았는데,

안드로이드 하이브리드앱 웹뷰 WebView 에서 카카오톡 로그인 (앱) 사용하기

아무튼 부자연스러운 액션들을 초례하게 되고 점점 더 사이즈가 커져버리는 것 같았다.
그래서 결론적으로는 로그인 부분만 앱으로 만든 뒤 웹뷰를 뛰우기로 결론 내렸다.

현재 react native를 써서 로그인 부분을 만들고 있고 카카오톡은 쉽게 잘 붙였으나,
IOS 때문에 애플로그인을 붙이는 과정에서 이슈가 발생했다....(이건 정말 갑질 아닌가 흑)

정말 쉽게 뚝딱 뚝딱 따라해서 붙였는데, 작동을 안한다.... ㅠㅠ 작동을 안해......... 왜 안해.......
너무 오랜 시간 삽질을 하다가 발견하게 되어서 공유한다 ㅠㅠ

애플 로그인 관련해서는 많은 글들이 있는데, 나는 보통 블로그를 보고 따라하다 보니 계속 아래와 같은 코드로 작업을 진행했다.

const onAppleButtonPress = async () => {
    try {
      const responseObject = await appleAuth.performRequest({
        requestedOperation: AppleAuthRequestOperation.LOGIN,
        requestedScopes: [AppleAuthRequestScope.EMAIL],
      });
      console.log('responseObject:::', responseObject);
      const credentialState = await appleAuth.getCredentialStateForUser(
        responseObject.user,
      );
      if (credentialState === AppleAuthCredentialState.AUTHORIZED) {
        console.log('user is authenticated');
      }
    } catch (error) {
      console.log(error);
      if (error.code === AppleAuthError.CANCELED) {
        console.log('canceled');
      } else {
        console.log('error');
      }
    }
  };

별 다르게 이슈가 있을 부분도 없는데 계속 별 다른 동작 없이
typeerror evaluating '_reactNativeAppleAuthentication.AppleAuthRequestOperation.LOGIN
이 에러를 마주하게 되었다.

그래서 도대체 왜 안되라고 분노하고 있을 때... 공식 문서에서 업데이트 된 부분을 찾았다.

async function onAppleButtonPress() {
  // performs login request
  const appleAuthRequestResponse = await appleAuth.performRequest({
    requestedOperation: appleAuth.Operation.LOGIN,
    requestedScopes: [appleAuth.Scope.EMAIL, appleAuth.Scope.FULL_NAME],
  });

  // get current authentication state for user
  // /!\ This method must be tested on a real device. On the iOS simulator it always throws an error.
  const credentialState = await appleAuth.getCredentialStateForUser(appleAuthRequestResponse.user);

  // use credentialState response to ensure the user is authenticated
  if (credentialState === appleAuth.State.AUTHORIZED) {
    // user is authenticated
  }
}

 

변경된 부분이 있었다. 

requestOperataion 부분과 requestedScopes 부분 그리고 AppleAuthCredentialState.AUTHORIZED 부분도 변경되었다.
이것을 공식문서와 같이 변경하니깐 곧바로 해결되었다. ㅠㅠ

나처럼 삽질 하는 사람이 있을 것 같아서 짧은 글로 남겨준다.