Lg0gs / react-native-tiktok

MIT License
50 stars 33 forks source link

iOS: Auth is working well but Sharing API return "NETWORK_FAILED" error #21

Open jumantet opened 1 year ago

jumantet commented 1 year ago

Hello all ! First thanks @Lg0gs for this amazing library.

Context:

Issue:

Here is the issue I am meeting when I am trying to test sharing feature in prebuild environment on real device (iOS 16.4.1): [PhotoKit] PHExternalAssetResource: Unable to issue sandbox extension for /.... My device opened tiktok but it loaded 2 seconds and send me back to my app (I tried removing the scheme in info plist to not force the callback when the sdk gave a response/error but nothing happens, I am staying on the home page of tiktok). I also tried with all kind of paths, directly from the image picker of expo, nothing happened.

If anyone has met this issue before with this lib or maybe with another one sharing content.

Thanks !!

shrihari1999 commented 1 year ago

@jumantet I'm very glad to see you got it working with Expo!!

Can you please spend 2 mins to see https://github.com/Lg0gs/react-native-tiktok/issues/19 and help me? Did you face the same issue on iOS? It would be really really helpful for me as i'm stuck with this issue for 2 months now

jumantet commented 1 year ago

@shrihari1999 I have the same warning as you but auth is working well, did you add all the scopes required for auth : user.info.basic, user.info.profil ?

jumantet commented 1 year ago

@Lg0gs sorry for mentioning you directly in the thread 😄 but I think I am really close to succeed. Now, every time I receive a "NETWORK_ERROR" from the TikTokSDK --> here it is the log it returns to me :

[PhotoKit] PHExternalAssetResource: Unable to issue sandbox extension for /L0/001 (hash=2792683855734136434)
2023-07-26 12:46:13.531737+0200 [2670:549234] [expo] 🟢 Posting 'appEntersBackground' event to registered modules
2023-07-26 12:46:13.534119+0200 [2670:549234] [expo] 🟢 Posting 'appEntersBackground' event to registered modules
2023-07-26 12:46:13.546177+0200 [2670:549234] [Snapshotting] Snapshotting a view (0x145b2b600, UIKeyboardImpl) that is not in a visible window requires afterScreenUpdates:YES.
2023-07-26 12:46:13.702347+0200 [2670:549638] [Common] Snapshot request 0x280e1d1d0 complete with error: <NSError: 0x280e043f0; domain: FBSSceneSnapshotErrorDomain; code: 3; reason: "the request was canceled">
2023-07-26 12:46:13.715012+0200 [2670:549234] [expo] 🟢 Posting 'appEntersForeground' event to registered modules
2023-07-26 12:46:13.715303+0200 [2670:549234] [expo] 🟢 Posting 'appEntersForeground' event to registered modules
2023-07-26 12:46:13.723683+0200 [2670:549650] [javascript] 'NETWORK_ERROR', 'ph://DBF44337-B9C5-4464-9549-3A61C079D5A0/L0/001'
2023-07-26 12:46:13.728005+0200 [2670:549650] [javascript] '[Sentry][captureException]', '"NETWORK_ERROR"'
2023-07-26 12:46:14.149875+0200 [2670:549234] [expo] 🟢 Posting 'appBecomesActive' event to registered modules
2023-07-26 12:46:14.150452+0200 [2670:549234] [expo] 🟢 Posting 'appBecomesActive' event to registered modules
shrihari1999 commented 1 year ago

@jumantet Sorry for late response. I thought the scopes can only be controlled from the native code, which is not decided by us users, but by the library itself as you can see here. Is there any way you included your own custom scopes? How's that and where?

jumantet commented 1 year ago

@shrihari1999 I am more talking about adding these scopes https://developers.tiktok.com/ in "manage your apps" section --> ![Uploading Capture d’écran 2023-07-26 à 13.06.16.png…]()

shrihari1999 commented 1 year ago

Yes, I've added them and got them approved @jumantet . I do not have "user.info.profile" as i dont require Read access to profile_web_link, profile_deep_link, bio_description, is_verified. Is it absolutely necessary for login to work?

2023-07-26-164235_1440x900_scrot

By the way, your screenshot link does not show image, it links to this github issue.

jumantet commented 1 year ago

@shrihari1999 I encourage you to add user.info.profile to the scopes and resubmit the app. Could you share your AppDelegate file please

shrihari1999 commented 1 year ago

@jumantet Since I use Expo, I have custom plugin to modify AppDelegate contents during the build process. How do you do it? Do you eject and change contents manually? Anyway, here is my plugin code

"use strict";
exports.__esModule = true;
var config_plugins_1 = require("@expo/config-plugins");

var withReactNativeTiktoktAppDelegate = function(config) {
  return config_plugins_1.withAppDelegate(config, cfg => {
    const launchOptionsReturn = 'return [super application:application didFinishLaunchingWithOptions:launchOptions];'
    const openUrlReturn = '[super application:application openURL:url options:options]'
    cfg.modResults.contents
      .replace(launchOptionsReturn, `[[TikTokOpenSDKApplicationDelegate sharedInstance] application:application didFinishLaunchingWithOptions:launchOptions];\n${launchOptionsReturn}`)
      .replace(openUrlReturn, `[[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey] annotation:options[UIApplicationOpenURLOptionsAnnotationKey]] || ${openUrlReturn}`)
      .replace('@end', `
      - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
      {
        if ([[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:sourceApplication annotation:annotation]) {
            return YES;
        }
        return NO;
      }

      - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url
      {
        if ([[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:nil annotation:nil]) {
            return YES;
        }
        return NO;
      }

      @end
      `)
    return cfg;
  });
}

var withUrlScheme = function(config) {
  return config_plugins_1.withInfoPlist(config, config => {
    config.modResults.CFBundleURLTypes.push({
      CFBundleURLSchemes: [config.ios.infoPlist.TikTokAppID],
    });
    return config;
  });
};

var withReactNativeTiktok = function(config) {
  return config_plugins_1.withPlugins(config, [
    withReactNativeTiktoktAppDelegate,
    withUrlScheme
  ]);
}

exports["default"] = withReactNativeTiktok;

And in app.json, i included the plugin

    "plugins": [
      "sentry-expo",
      "react-native-compressor",
      "./plugins/react-native-tiktok/withReactNativeTiktok.js"
    ],
jumantet commented 1 year ago

@shrihari1999 just a dumb question are you sure you are using your "client key" as TikTokAppId ?

in Xcode when you build the app, are the changes applied in your AppDelegate file ?

Also in your AppDelegate, it does not seem that you import TikTokSDK. Please copy paste the code of your AppDelegate.m file directly from Xcode when building your app please.

shrihari1999 commented 1 year ago
  1. @jumantet You mean in the app.json correct? Yes, here is the ios part of my app.json
    "ios": {
      "supportsTablet": true,
      "bundleIdentifier": "com.tinderly",
      "buildNumber": "6",
      "config": {
        "usesNonExemptEncryption": false
      },
      "infoPlist": {
        "LSApplicationQueriesSchemes": [
          "tiktokopensdk",
          "tiktoksharesdk",
          "snssdk1180",
          "snssdk1233"
        ],
        "TikTokAppID": "aw15gr0awpsu1mq8"
      }
    }
2. I assume its applied in the AppDelegate file, but I'm unable to verify since I don't have a mac, hence I don't have xcode. I rely on EAS service to build my project. But I remember I used ```npx expo prebuild``` to check the contents and it worked, the contents were there. I can run it again in a while and show you.
shrihari1999 commented 1 year ago

You were right @jumantet . My plugin was not working properly. I've fixed the plugin now. Will test it entirely and let you know in a while.

This is the new AppDelegate.m file... is this correct?

#import "AppDelegate.h"

#import <React/RCTBundleURLProvider.h>
#import <React/RCTLinkingManager.h>

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  self.moduleName = @"main";

  // You can add your custom initial props in the dictionary below.
  // They will be passed down to the ViewController used by React Native.
  self.initialProps = @{};

  [[TikTokOpenSDKApplicationDelegate sharedInstance] application:application didFinishLaunchingWithOptions:launchOptions];
return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
  return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
}

/// This method controls whether the `concurrentRoot`feature of React18 is turned on or off.
///
/// @see: https://reactjs.org/blog/2022/03/29/react-v18.html
/// @note: This requires to be rendering on Fabric (i.e. on the New Architecture).
/// @return: `true` if the `concurrentRoot` feature is enabled. Otherwise, it returns `false`.
- (BOOL)concurrentRootEnabled
{
  return true;
}

// Linking API
- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
  return [[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:options[UIApplicationOpenURLOptionsSourceApplicationKey] annotation:options[UIApplicationOpenURLOptionsAnnotationKey]] || [super application:application openURL:url options:options] || [RCTLinkingManager application:application openURL:url options:options];
}

// Universal Links
- (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler {
  BOOL result = [RCTLinkingManager application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
  return [super application:application continueUserActivity:userActivity restorationHandler:restorationHandler] || result;
}

// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *)deviceToken
{
  return [super application:application didRegisterForRemoteNotificationsWithDeviceToken:deviceToken];
}

// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didFailToRegisterForRemoteNotificationsWithError:(NSError *)error
{
  return [super application:application didFailToRegisterForRemoteNotificationsWithError:error];
}

// Explicitly define remote notification delegates to ensure compatibility with some third-party libraries
- (void)application:(UIApplication *)application didReceiveRemoteNotification:(NSDictionary *)userInfo fetchCompletionHandler:(void (^)(UIBackgroundFetchResult))completionHandler
{
  return [super application:application didReceiveRemoteNotification:userInfo fetchCompletionHandler:completionHandler];
}

      - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
      {
        if ([[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:sourceApplication annotation:annotation]) {
            return YES;
        }
        return NO;
      }

      - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url
      {
        if ([[TikTokOpenSDKApplicationDelegate sharedInstance] application:application openURL:url sourceApplication:nil annotation:nil]) {
            return YES;
        }
        return NO;
      }

      @end
jumantet commented 1 year ago

hum not sure, try like this but I think you should import the sdk at the top of the delegate file like it is mentioned in step 4 : https://developers.tiktok.com/doc/getting-started-ios-quickstart-objective-c

jumantet commented 1 year ago

@shrihari1999 how is it going ?

shrihari1999 commented 1 year ago

Sorry @jumantet I've abandoned the project and have no intention of continuing it for the foreseeable future. Thank you so much for your support so far

alejandrorbradford commented 8 months ago

@jumantet is this repo not being updated? I'd like to help. I'm investigating this issue; https://github.com/Lg0gs/react-native-tiktok/issues/24

Can you check on your side as well?