[React Native Expo] 네이버로그인 prebuild하기

JS/React Native Expo · 2024. 1. 23. 15:08
728x90

https://coding-levup.tistory.com/52

 

[React Native Expo] 카카오로그인 prebuild하기

https://github.com/crossplatformkorea/react-native-kakao-login GitHub - crossplatformkorea/react-native-kakao-login: react-native native module for Kakao sign in. react-native native module for Kakao sign in. Contribute to crossplatformkorea/react-native-k

coding-levup.tistory.com

기본적인건 일단 카카오로그인이랑 비슷하다

써드파티라이브러리도 같은제작자가 만든것같다(이름도비슷함)

https://github.com/crossplatformkorea/react-native-naver-login

 

GitHub - crossplatformkorea/react-native-naver-login: 리엑트 네이티브 네이버 로그인 라이브러리

리엑트 네이티브 네이버 로그인 라이브러리. Contribute to crossplatformkorea/react-native-naver-login development by creating an account on GitHub.

github.com

라이브러리 주소

npm install @react-native-seoul/naver-login --save

설치

//Info.plist
<key>LSApplicationQueriesSchemes</key>
<array>
  <string>naversearchapp</string>
  <string>naversearchthirdlogin</string>
</array>

생각보다 되게 간단했다.

ios쪽에 Info.plist파일에 저 내용만 추가해주면됨; 그대신 스크립트쪽이 좀 복잡하다

 

  //네이버
  const [NaverResult, setNaverResult] =
    useState<NaverLoginResponse["successResponse"]>();
  const loginWithNaver = async (): Promise<void> => {
    try {
      const { successResponse } = await naverLogin.login({
        appName: "등록한 앱 이름",
        consumerKey: "내 키",
        consumerSecret: "내 시크릿키",
        serviceUrlScheme: "등록한 Scheme",
      });
      setResult("성공 :" + JSON.stringify(successResponse));
      setNaverResult(successResponse);
    } catch (err) {
      setResult("실패 :" + JSON.stringify(err));
    }
  };
  const getProfileWidthNaver = async (): Promise<void> => {
    try {
      const data = await naverLogin.getProfile(NaverResult.accessToken);
      setResult("성공 :" + JSON.stringify(data));
    } catch (err) {
      setResult("실패 :" + JSON.stringify(err));
    }
  };

네이버개발자에 앱 등록하면 App ID랑 시크릿키랑 다 생긴다

그러고 android랑 ios에 각 패키지 등록해주고 안드쪽에 키해시 등록해주고하믄된다

카카오로그인하고나서 네이버로그인하면 ea~~~~~~~~sy함

728x90
Copyright © Nana
levup