Docs

Login Kit Android

Requirements

  • Client ID from the developer portal
  • Android Studio 3.0+
  • Gradle 3.0+
  • Android API Level 19+

To connect your app to Snapchat, your app must also have the following targets:

  • Android support library version 22+
  • Snapchat 10.34.0.0+

Understanding Scopes

Scopes let your application declare which Login Kit features it wants access to. If a scope is toggleable, the user can deny access to one scope while agreeing to grant access to others.

Login Kit offers the following scopes:

  • https://auth.snapchat.com/oauth2/api/user.display_name: Grants access to the user's Snapchat display name
  • https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar: Grants access to the user's Bitmoji avatar; toggleable by user

When you specify which scopes you'd like, use the full URL, like this:

1  <key>SCSDKScopes</key>
2  <array>
3    <string>https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar</string>
4    <!-- other scopes you might have... -->
5  </array>

Getting Started

We share the Login Kit and Core Kit AARs from our Maven repository. To access them, add the following code block to your root project's build.gradle file:

1repositories {
2   maven {
3       url "https://storage.googleapis.com/snap-kit-build/maven"
4   }
5}

Note: If you have trouble accessing Google (used in the link above), you can use our GitHub Maven repository with the following code block:

1repositories {
2   maven {
3       url "https://raw.githubusercontent.com/Snap-Kit/release-maven/repo"
4   }
5}

Next, add the following implementation to the dependencies section of your application’s build.gradle file, not the root project’s build.gradle:

1dependencies {
2   ...
3   implementation([
4           'com.snapchat.kit.sdk:login:1.10.0',
5           'com.snapchat.kit.sdk:core:1.10.0'
6   ])
7}

Finally, add your application’s client ID, redirect URL, and scopes to the appropriate meta-data tags in your application’s AndroidManifest.xml. The SDK automatically fetches these values to enable deeplinking from your app to Snapchat. For a list of available scopes, please see the Understanding Scopes section of this document

1<uses-permission android:name="android.permission.INTERNET" />
2
3<application ...>
4   <meta-data android:name="com.snapchat.kit.sdk.clientId" android:value="your app’s client id" />
5   <meta-data android:name="com.snapchat.kit.sdk.redirectUrl" android:value="the url that will handle login completion" />
6   <meta-data android:name="com.snapchat.kit.sdk.scopes" android:resource="@array/snap_connect_scopes" /> <!-- This should be a string array of scopes !-->
7
8   ...
9
10   <activity
11       android:name="com.snapchat.kit.sdk.SnapKitActivity"
12       android:launchMode="singleTask"
13       >
14       <intent-filter>
15           <action android:name="android.intent.action.VIEW" />
16           <category android:name="android.intent.category.DEFAULT" />
17           <category android:name="android.intent.category.BROWSABLE" />
18           <!--
19               Enter the parts of your redirect url below
20               e.g., if your redirect url is myapp://snap-kit/oauth2
21                   android:scheme="myapp"
22                   android:host="snap-kit"
23                   android:path="oauth2"
24           !-->
25           <data
26               android:scheme="the scheme of your redirect url"
27               android:host="the host of your redirect url"
28               android:path="the path of your redirect url"
29               />
30       </intent-filter>
31
32   </activity>
33
34   ...
35</application>

If your app targets Android 11 (API level 30) or higher, you will need to include the following package query in your app's AndroidManifest.xml:

1<queries>
2  <package android:name="com.snapchat.android" />
3</queries>

In the example above, you'll have to define snap_connect_scopes as an Android resource array in values/arrays.xml. Example:

1<?xml version="1.0" encoding="utf-8"?>
2<resources>
3    <string-array name="snap_connect_scopes">
4        <item>https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar</item>
5        <item>https://auth.snapchat.com/oauth2/api/user.display_name</item>
6    </string-array>
7</resources>

As of v1.4.4, Snap Kit is supported on x86 automatically. To filter out the x86 libraries, include the following snippet in your app's build.gradle:

1defaultConfig {
2  ndk {
3    abiFilters 'armeabi-v7a', 'arm64-v8a'
4  }
5}

For older versions, to support Snap Kit on x86 and x86_64, include the following snippet in your app's build.gradle:

1configurations.all {
2    resolutionStrategy {
3        force 'com.snapchat.kit.sdk:core:' + <versionName> + ' x86'
4
5        }
6} // Where <versionName> is the Snap Kit version you are using (Minimum 1.2.0)

Initiating Login with Snapchat

The SDK provides a button that initiates the Snapchat login process. A tap on this button in your app redirects users to Snapchat if they have it installed. If not, it prompts them to log in with Snapchat through an in-app web view.

To add the login button to your app, add the import and view below. This adds the button to your desired root view with the default styling.

1import com.snapchat.kit.sdk.SnapLogin;
2
3View mLoginButton = SnapLogin.getButton(getContext(), (ViewGroup)mViewRoot);

To add the login flow using a custom button, it’s a little different:

1View yourView = findViewById(...);
2yourView.setOnClickListener(new OnClickListener() {
3   @Override
4   public void onClick() {
5        SnapLogin.getAuthTokenManager(this).startTokenGrant();
6   }
7});

Now when a user taps the button, your app will start auth with Snapchat!


Subscribing to Login State Updates

For updates on the success of this login process, define an onLoginStateChangedListener:

1// Import needed for LoginStateController
2import com.snapchat.kit.sdk.core.controller.LoginStateController;
3
4final LoginStateController.OnLoginStateChangedListener mLoginStateChangedListener =
5    new LoginStateController.OnLoginStateChangedListener() {
6        @Override
7        public void onLoginSucceeded() {
8            // Here you could update UI to show login success
9        }
10
11        @Override
12        public void onLoginFailed() {
13            // Here you could update UI to show login failure
14        }
15
16        @Override
17        public void onLogout() {
18            // Here you could update UI to reflect logged out state
19        }
20    };
21
22// Add the LoginStateChangedListener you’ve defined to receive LoginInState updates
23SnapLogin.getLoginStateController(getContext()).addOnLoginStateChangedListener(mLoginStateChangedListener);

To unsubscribe your LoginStateChangedListener from updates, use the following line:

1SnapLogin.getLoginStateController(this).removeOnLoginStateChangedListener(mLoginStateChangedListener);

Querying Login State

To check whether the user is currently logged in, use SnapLogin.isUserLoggedIn:

1boolean isUserLoggedIn = SnapLogin.isUserLoggedIn(getContext());

Sending Requests to Get User Data

Once a user logs into your app with Snapchat, you can make requests for their display name or Bitmoji avatar. The following example makes a request for both. Upon success, this example callback loads the display name into a TextView mDisplayNameTextView and loads the Bitmoji into an ImageView mBitmojiImageView:

1String query = "{me{bitmoji{avatar},displayName}}";
2String variables = null;
3SnapLogin.fetchUserData(this, query, variables, new FetchUserDataCallback() {
4    @Override
5    public void onSuccess(@Nullable UserDataResponse userDataResponse) {
6        if (userDataResponse == null || userDataResponse.getData() == null) {
7            return;
8        }
9
10        MeData meData = userDataResponse.getData().getMe();
11        if (meData == null) {
12            return;
13        }
14
15        mNameTextView.setText(userDataResponse.getData().getMe().getDisplayName());
16
17        if (meData.getBitmojiData() != null) {
18            Glide.with(getContext())
19                    .load(meData.getBitmojiData().getAvatar())
20                    .into(mBitmojiImageView);
21        }
22    }
23
24    @Override
25    public void onFailure(boolean isNetworkError, int statusCode) {
26
27    }
28});

Sending Requests to Get the externalId

Once a user logs into your app with Snapchat, you can make requests for their external ID. This is a unique identifier for this user on your app. The following example requests this identifier for the user that is currently logged in and saves it for use in other Snap Kit features:

1String query = "{me{externalId}}";
2SnapLogin.fetchUserData(this, query, null, new FetchUserDataCallback() {
3    @Override
4    public void onSuccess(@Nullable UserDataResponse userDataResponse) {
5        if (userDataResponse == null || userDataResponse.getData() == null) {
6            return;
7        }
8
9        MeData meData = userDataResponse.getData().getMe();
10        if (meData == null) {
11            return;
12        }
13
14        mBackend.save(userDataResponse.getData().getMe().getExternalId());
15    }
16
17    @Override
18    public void onFailure(boolean isNetworkError, int statusCode) {
19
20    }
21});

Unlinking

A user can choose to end the current OAuth2 Snapchat session and no longer share their Display Name and Bitmoji avatar with your app. The clearToken() method below can be used to clear the access and refresh tokens locally:

1SnapLogin.getAuthTokenManager(this).clearToken();

Note: Once the clearToken() command is executed, fetchUserData() requests will result in permission errors.


What’s Next