Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rnheroes/tiktok-opensdk-react-native
Unofficial TikTok OpenSDK features Share Kit which allow your users to share content from your app to TikTok.
https://github.com/rnheroes/tiktok-opensdk-react-native
react-native tiktok tiktok-sdk
Last synced: 3 months ago
JSON representation
Unofficial TikTok OpenSDK features Share Kit which allow your users to share content from your app to TikTok.
- Host: GitHub
- URL: https://github.com/rnheroes/tiktok-opensdk-react-native
- Owner: rnheroes
- License: mit
- Created: 2024-09-23T09:25:36.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-10-17T09:22:09.000Z (4 months ago)
- Last Synced: 2024-11-01T06:51:28.379Z (3 months ago)
- Topics: react-native, tiktok, tiktok-sdk
- Language: Kotlin
- Homepage:
- Size: 1.4 MB
- Stars: 18
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
# TikTok OpenSDK React Native
This package provides a React Native wrapper for the TikTok OpenSDK, allowing you to integrate TikTok sharing functionality into your React Native applications.
## Installation
```bash
npm install tiktok-opensdk-react-native
# or
yarn add tiktok-opensdk-react-native
````## Usage
```javascript
import TikTokOpenSDK from 'tiktok-opensdk-react-native';// ...
try {
const result = await TikTokOpenSDK.share(
['path/to/media1', 'path/to/media2'],
false, // isImage (true for images, false for videos)
false // isGreenScreen
);if (result.isSuccess) {
console.log('Share successful!');
} else {
console.error('Share failed:', result.errorMsg);
}
} catch (error) {
console.error('Error sharing to TikTok:', error);
}
```# API
## `TikTokOpenSDK.share(mediaPaths: string[], isImage: boolean, isGreenScreen: boolean): Promise`
Shares media to TikTok.
### Parameters
- `mediaPaths: string[]` - Array of local media file paths to share
- `isImage: boolean` - Set to `true` for images, `false` for videos
- `isGreenScreen: boolean` - Set to `true` to use green screen effect (TikTok app only)Returns a Promise that resolves to a `ShareResult` object.
```typescript
type ShareResult = ShareSuccessResult | ShareErrorResult;interface ShareSuccessResult {
isSuccess: true;
}interface ShareErrorResult {
isSuccess: false;
errorCode: number;
subErrorCode?: number;
shareState?: number;
errorMsg: string;
}
```# iOS Setup
Minimum iOS version: 12.0
Minimum Xcode version: 10.01. Link the package to your project by running `npx pod-install` or `cd ios && pod install`.
2. Add the TikTok OpenSDK client key to your `Info.plist` file:```xml
LSApplicationQueriesSchemestiktokopensdk
tiktoksharesdk
snssdk1180
snssdk1233TikTokClientKey
$TikTokClientKey
CFBundleURLTypes
CFBundleURLSchemes
$TikTokClientKey
```
3. Add NSPhotoLibraryUsageDescription to your `Info.plist` file:
```xml
NSPhotoLibraryAddUsageDescription
$(PRODUCT_NAME) would like to save photos to your photo library
NSPhotoLibraryUsageDescription
$(PRODUCT_NAME) would like to access your photo library
```4. Update your AppDelegate.m
```objc
#import@implementation AppDelegate
// ... other methods ...
- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary *)options
{
BOOL handled = NO;if ([TiktokOpensdkReactNative handleOpenURL:url]) {
handled = YES;
}// Handle other custom URL schemes
return handled;
}- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)(NSArray> * _Nullable))restorationHandler
{
BOOL handled = NO;if ([TiktokOpensdkReactNative handleUserActivity:userActivity]) {
handled = YES;
}// Handle other user activities
return handled;
}@end
```# Android Setup
Minimum Android version: API level 21 (Android 5.0 Lollipop) or later
1. Add the TikTok SDK repository to your project-level build.gradle:
```gradle
allprojects {
repositories {
maven { url "https://artifact.bytedance.com/repository/AwemeOpenSDK" }
}
}
```2. Add the TikTok SDK dependencies to your app-level build.gradle
```gradle
dependencies {
implementation 'com.tiktok.open.sdk:tiktok-open-sdk-core:2.3.0'
implementation 'com.tiktok.open.sdk:tiktok-open-sdk-share:2.3.0' // for share API
}
```3. For Android 11 and higher, add the following to your AndroidManifest.xml:
```xml
```
4. Add client key to your strings.xml file:
```xml
$TikTokClientKey
```5. Add metadata to your AndroidManifest.xml file:
```xml
```
6. Add this provider to your AndroidManifest.xml:
```xml
```
7. Create a filepaths.xml file in your res/xml folder:
```xml
```
# Troubleshooting
If you encounter any issues, please check the TikTok OpenSDK documentation for more detailed setup instructions and troubleshooting tips.
# License
MIT
# Roadmap
- [ ] Refactor API to use a single `share` method with an options object
- [ ] Add support for login and authorization APIs
- [ ] Send shareShate for error handling in iOS
- [ ] Add support redirectUri for both platforms
- [ ] Add custom client key for both platforms
- [ ] Refactor API, pass client key, redirectUri, and callerScheme as last parameters
- [ ] Add support remote media URLs
- [ ] Handle photo library permissions in native side
- [ ] Refactor whole android part
- [ ] Check if tiktok app is installed
- [ ] Remove isImage parameter and detect media type automatically