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.plistfile 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.swiftfile:
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.gradlefile and add the maven repository
allprojects {
repositories {
maven { url "https://artifact.bytedance.com/repository/AwemeOpenSDK" }
}
}
- Go to
android/app/src/main/AndroidManifest.xmlfile after<application>tag before<activityadd:
<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
