코딩스토리

[Android/안드로이드] 네이버 아이디로 로그인(Naver Login) 연동 본문

Android/유용한 기술

[Android/안드로이드] 네이버 아이디로 로그인(Naver Login) 연동

라크라꾸 2020. 8. 3. 00:24

이번 포스팅에는 안드로이드 네아로(네이버 아이디로 로그인)연동하는법에 대해 알아보겠습니다.

 

우선 네이버 개발문서로 가서 통신 키값을 가져와야 합니다.

 

https://developers.naver.com/docs/login/android/ 

 

네이버아이디로로그인 안드로이드 개발가이드

NAVER Developers - 네이버아이디로로그인 안드로이드 개발가이드

developers.naver.com

사이트에 들어가시면 네이버로그인을 해 주신 후에

오픈 API 이용 신청 버튼을 누릅니다.

위와 같은 화면이 나오게되는데, 어플리케이션 이름과 사용API에 맞게 설정해줍니다. 여기서는 네이버 아이디로 로그인 API만 필요하기 때문에 콤보박스에 있는 내용은 선택하지 않고, 네이버 아이디로 로그인했을 시 필요한 데이터만 체크를 해줍니다. 로그인 오픈 API 서비스 환경은 안드로이드를 선택하고 다운로드 URL은 아직 마켓에 출시가 되지 않았을 경우는 임의로 설정을 해주시고, 마켓에 출시를 하게되면 URL을 수정해주셔야 합니다. 앱 패키지 이름을 추가해주고 등록하기버튼을 누릅니다.

 

등록을 하게되면 ClientID와 Client Secret값이 나오게됩니다.

 

개발 환경 설정

build.gradle(Module.app)

    
    dependencies {
    
        ...
        
        //네이버 로그인
        implementation 'com.naver.nid:naveridlogin-android-sdk:4.2.6'   // import from jcenter
    
        // naveridlogin dependencies
        def android_x_version = "1.0.0"
        implementation "androidx.appcompat:appcompat:$android_x_version"
        implementation "androidx.legacy:legacy-support-core-utils:$android_x_version"
        implementation "androidx.browser:browser:$android_x_version"
        implementation "androidx.legacy:legacy-support-v4:$android_x_version"
    }
    

다음과 같이 프로젝트의 build.gradle에 네이버 로그인 라이브러리를 추가해줍니다.

 

app/res/values/strings.xml

    
    <resources>
        <string name="app_name">NaverLoginSample</string>
    
        <string name="naver_client_id">xxx</string>
        <string name="naver_client_secret">xxx</string>
        <string name="naver_client_name">xxx</string>
    </resources>
    

아까 받아온 clientId와 clientSecret, 애플리케이션 이름을 넣어줍니다.

 

activity_main.xml

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    
        <LinearLayout
            android:id="@+id/ll_naver_login"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:background="#1EC800"
            android:gravity="center"
            android:orientation="horizontal"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_marginBottom="8dp"
            app:layout_constraintBottom_toTopOf="@+id/btn_logout"
            tools:layout_editor_absoluteX="16dp">
    
            <ImageView
                android:id="@+id/imageView2"
                android:layout_width="40dp"
                android:layout_height="40dp"
                android:src="@drawable/sns_naver"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="@+id/tv_kakao2"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />
    
            <TextView
                android:id="@+id/tv_naver"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="네이버로 시작하기"
                android:textColor="#ffffff"
                android:textStyle="bold"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />
    
    
        </LinearLayout>
    
        <Button
            android:id="@+id/btn_logout"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:background="#1EC800"
            android:gravity="center"
            android:textColor="#ffffff"
            android:text="로그아웃"
            android:layout_marginLeft="16dp"
            android:layout_marginRight="16dp"
            android:layout_marginBottom="24dp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"/>
    
    
    
    </androidx.constraintlayout.widget.ConstraintLayout>
    

다음과같이 레이아웃을 마음껏 꾸며줍니다.

단, 네이버는 로그인 버튼 가이드가 있기 때문에 개발을 할 때 주의하셔야합니다.

 

다음은 네이버아이디 로그인 버튼 사용 가드입니다. 참고하시기바랍니다.

 

https://developers.naver.com/docs/login/bi/

 

네이버아이디로로그인 로그인 버튼 사용 가이드

NAVER Developers - 네이버아이디로로그인 로그인 버튼 사용 가이드

developers.naver.com

    
    package com.lakue.naverloginsample;
    
    import androidx.appcompat.app.AppCompatActivity;
    
    import android.annotation.SuppressLint;
    import android.content.Context;
    import android.os.Bundle;
    import android.util.Log;
    import android.view.View;
    import android.widget.Button;
    import android.widget.LinearLayout;
    import android.widget.Toast;
    
    import com.nhn.android.naverlogin.OAuthLogin;
    import com.nhn.android.naverlogin.OAuthLoginHandler;
    
    public class MainActivity extends AppCompatActivity {
    
        LinearLayout ll_naver_login;
        Button btn_logout;
    
        OAuthLogin mOAuthLoginModule;
        Context mContext;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mContext = getApplicationContext();
            
            ll_naver_login = findViewById(R.id.ll_naver_login);
            btn_logout = findViewById(R.id.btn_logout);
    
            ll_naver_login.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mOAuthLoginModule = OAuthLogin.getInstance();
                    mOAuthLoginModule.init(
                            mContext
                            ,getString(R.string.naver_client_id)
                            ,getString(R.string.naver_client_secret)
                            ,getString(R.string.naver_client_name)
                            //,OAUTH_CALLBACK_INTENT
                            // SDK 4.1.4 버전부터는 OAUTH_CALLBACK_INTENT변수를 사용하지 않습니다.
                    );
    
                    @SuppressLint("HandlerLeak")
                    OAuthLoginHandler mOAuthLoginHandler = new OAuthLoginHandler() {
                        @Override
                        public void run(boolean success) {
                            if (success) {
                                String accessToken = mOAuthLoginModule.getAccessToken(mContext);
                                String refreshToken = mOAuthLoginModule.getRefreshToken(mContext);
                                long expiresAt = mOAuthLoginModule.getExpiresAt(mContext);
                                String tokenType = mOAuthLoginModule.getTokenType(mContext);
    
                                Log.i("LoginData","accessToken : "+ accessToken);
                                Log.i("LoginData","refreshToken : "+ refreshToken);
                                Log.i("LoginData","expiresAt : "+ expiresAt);
                                Log.i("LoginData","tokenType : "+ tokenType);
    
                            } else {
                                String errorCode = mOAuthLoginModule
                                        .getLastErrorCode(mContext).getCode();
                                String errorDesc = mOAuthLoginModule.getLastErrorDesc(mContext);
                                Toast.makeText(mContext, "errorCode:" + errorCode
                                        + ", errorDesc:" + errorDesc, Toast.LENGTH_SHORT).show();
                            }
                        };
                    };
    
                    mOAuthLoginModule.startOauthLoginActivity(MainActivity.this, mOAuthLoginHandler);
                }
            });
    
            btn_logout.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    mOAuthLoginModule.logout(mContext);
                    Toast.makeText(MainActivity.this, "로그아웃 되었습니다.", Toast.LENGTH_SHORT).show();
                }
            });
        }
    }
    

 

다음 코드를 작성하면 네이버아이디로 로그인하는 기능과 로그아웃을 하는 기능이 완성됩니다.

로그아웃을 할 때는 저장된 토큰만 삭제하므로 약전계나 네트워크 오류에 영향을 받지 않으니 따로 네트워크 처리는 안하셔도 될듯합니다.

 

네이버로 시작하기 버튼을 누르면 다음과 같이 네이버 로그인 창이 뜨고, 로그인을 할 수 있습니다.

로그아웃을 하게되면 저장된 토큰을 삭제하고 토스트메시지를 띄워주도록 했습니다.

 

로그인을 했을 경우에는 다음과 같은 정보를 가져올 수 있습니다.

이상 안드로이드 네이버아이디 로그인 연동에 대한 포스팅을 마치겠습니다.

 

궁금하시거나 잘 안되는 부분이 있다면 gitHub에 소스코드 올려놓을테니 참고 바랍니다~

https://github.com/lakue119/NaverLoginSample

 

lakue119/NaverLoginSample

Contribute to lakue119/NaverLoginSample development by creating an account on GitHub.

github.com

 

Comments