Get authorized and fetch user profile
v2 uses modern Tiktok Open SDK and legacy API is dropped, if your RN version < 0.69 then please refer v1
It's mandatory to provide iOS Universal Link
and Android App Link
to the Tiktok Developers Portal in order to Tiktok App to be able to call your App when the operation is completed.
Check this article how to setup Deep Links in React Native, only iOS Setup: (skip 3) and Android Setup:
npm install react-native-tiktok
or
yarn add react-native-tiktok
cd ios && pod install
- iOS version 11.0 or later
- XCode version 9.0 or later
- Sign up for a developer account on the TikTok for Developers website.
- Create a new app, add the required details, and submit it for review.
- Open your
Info.plist
file and add or update the following key-value pairs:
<key>LSApplicationQueriesSchemes</key>
<array>
<string>tiktokopensdk</string>
<string>tiktoksharesdk</string>
<string>snssdk1180</string>
<string>snssdk1233</string>
</array>
<key>TikTokClientKey</key>
<string>$TikTokClientKey</string>
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleURLSchemes</key>
<array>
<string>$TikTokClientKey</string>
</array>
</dict>
</array>
Note: Replace all $TikTokClientKey with your Client key retrieved from the developers portal
- Add the following code to your app's
AppDelegate.swift
file:
import TikTokOpenSDKCore
override func application(_ app: UIApplication,open url: URL, options:
[UIApplication.OpenURLOptionsKey: Any] = [:]) -> Bool {
if (TikTokURLHandler.handleOpenURL(url)) {
return true
}
return false
}
override func application(_ application: UIApplication, continue userActivity: NSUserActivity,
restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void) -> Bool {
if (TikTokURLHandler.handleOpenURL(userActivity.webpageURL)) {
return true
}
return false
}
The minimum system requirement is an API level of 21: Android 5.0 (Lollipop) or later.
- Go to
android/build.gradle
file and add the maven repository
allprojects {
repositories {
maven { url "https://artifact.bytedance.com/repository/AwemeOpenSDK" }
}
}
- Go to
android/app/src/main/AndroidManifest.xml
file after<application>
tag before<activity
add:
<meta-data android:name="TikTokClientKey" android:value="<TIKTOK_CLIENT_KEY>"/>
This step is pretty straightforward and includes modification of only app.json
file
"expo": {
...
"plugins": [
[
"react-native-tiktok",
{
"tiktokClientKey": "<YOUR_TIKTOK_CLIENT_KEY>"
}
]
]
}
import { authorize, Scopes } from 'react-native-tiktok';
authorize({
redirectURI: '<YOUR_REDIRECT_URL>', // your universal link
scopes: [Scopes.user.info.basic, Scopes.video.list, ...], // optional: "user.info.basic" will be included by default
callback: (authCode, codeVerifier) => {
// codeVerifier is returned only on Android
console.log(authCode, codeVerifier);
},
});
Use authCode
to manage User Access Token