react-native - 分支 io 链接 +clicked_branch_link 始终为 false

标签 react-native branch.io

我正在尝试将 Branch io 链接实现到我的 Android 应用程序,但我无法让它们正常工作。使用本指南:https://help.branch.io/developers-hub/docs/react-native

仪表板配置: Android URI 方案

https://com.example.host://

Android 应用程序链接已启用,应用程序是从 Play 商店中选择的,并且我已输入 SHA256 证书指纹。

Android list

        <!-- Branch URI Scheme -->
        <intent-filter>
            <data android:scheme="example.scheme" android:host="open" />
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
        </intent-filter>

        <!-- Branch App Links -->
        <intent-filter android:autoVerify="true">
            <action android:name="android.intent.action.VIEW" />
            <category android:name="android.intent.category.DEFAULT" />
            <category android:name="android.intent.category.BROWSABLE" />
            <data android:scheme="http" android:host="com.example.host"/>
            <data android:scheme="https" android:host="com.example.host"/>
        </intent-filter>

    <!-- Branch keys -->
        <!-- (Omit if setting keys in branch.json) -->
        <meta-data android:name="io.branch.sdk.BranchKey" android:value="key_live_mykey"/>
        <meta-data android:name="io.branch.sdk.BranchKey.test" android:value="key_test_mykey"/>

主要事件

package com.efri_mobile;

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.zoontek.rnbootsplash.RNBootSplash;
import io.branch.rnbranch.*;
import android.content.Intent;


public class MainActivity extends ReactActivity {

  /**
   * Returns the name of the main component registered from JavaScript. This is used to schedule
   * rendering of the component.
   */
  @Override
  protected String getMainComponentName() {
    return "efrimobile";
  }

  @Override
  protected void onStart() {
      super.onStart();
      RNBranchModule.initSession(getIntent().getData(), this);
  }

  @Override
  public void onNewIntent(Intent intent) {
      super.onNewIntent(intent);
      RNBranchModule.onNewIntent(intent);
  }

  @Override
  protected ReactActivityDelegate createReactActivityDelegate() {
    return new ReactActivityDelegate(this, getMainComponentName()) {

      @Override
      protected void loadApp(String appKey) {
        RNBootSplash.init(MainActivity.this); // <- initialize the splash screen
        super.loadApp(appKey);
      }
    };
  }
}

主应用程序

package com.efri_mobile;

import android.app.Application;
import android.content.Context;
import com.facebook.react.PackageList;
import com.facebook.react.ReactApplication;
import com.oblador.vectoricons.VectorIconsPackage;
import com.oblador.vectoricons.VectorIconsPackage;
import com.facebook.react.ReactInstanceManager;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.soloader.SoLoader;
import java.lang.reflect.InvocationTargetException;
import java.util.List;
import io.branch.rnbranch.RNBranchModule;


public class MainApplication extends Application implements ReactApplication {

  private final ReactNativeHost mReactNativeHost =
      new ReactNativeHost(this) {
        @Override
        public boolean getUseDeveloperSupport() {
          return BuildConfig.DEBUG;
        }

        @Override
        protected List<ReactPackage> getPackages() {
          @SuppressWarnings("UnnecessaryLocalVariable")
          List<ReactPackage> packages = new PackageList(this).getPackages();
          // Packages that cannot be autolinked yet can be added manually here, for example:
          // packages.add(new MyReactNativePackage());
          return packages;
        }

        @Override
        protected String getJSMainModuleName() {
          return "index";
        }
      };

  @Override
  public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
  }

  @Override
  public void onCreate() {
    super.onCreate();
    RNBranchModule.getAutoInstance(this);
    SoLoader.init(this, /* native exopackage */ false);
    initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
  }

  /**
   * Loads Flipper in React Native templates. Call this in the onCreate method with something like
   * initializeFlipper(this, getReactNativeHost().getReactInstanceManager());
   *
   * @param context
   * @param reactInstanceManager
   */
  private static void initializeFlipper(
      Context context, ReactInstanceManager reactInstanceManager) {
    if (BuildConfig.DEBUG) {
      try {
        /*
         We use reflection here to pick up the class that initializes Flipper,
        since Flipper library is not available in release mode
        */
        Class<?> aClass = Class.forName("com.efri_mobile.ReactNativeFlipper");
        aClass
            .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class)
            .invoke(null, context, reactInstanceManager);
      } catch (ClassNotFoundException e) {
        e.printStackTrace();
      } catch (NoSuchMethodException e) {
        e.printStackTrace();
      } catch (IllegalAccessException e) {
        e.printStackTrace();
      } catch (InvocationTargetException e) {
        e.printStackTrace();
      }
    }
  }
}

应用程序.tsx

//Read branch link
  useEffect(() => {
    const unsubscribe = branch.subscribe(({ error, params, uri }) => {
      if (error) {
        console.error('Error from Branch: ' + error);
        return;
      }
      console.log('PARAMS: ', params, uri);
    });

    return () => unsubscribe();
  });

我通过单击按钮从仪表板应用程序打开链接 (example.app.link)。应用程序可以正确打开,但 +clicked_branch_link 始终为 false。

我没有使用测试链接。我的 Android list 中的实时 key 设置正确。

这是我一年内第三次尝试实现分支链接,这部分我总是遇到问题。我缺少什么?如果我想使用应用程序链接,是否需要有 Branch URI 方案?

最佳答案

折腾了好久,终于找到了一个可行的解决方案。分支指南非常具有误导性,遵循它根本不起作用。

我遵循了这个指南:https://dev.to/chakrihacker/integrating-branch-in-react-native-0-60-3lfj

如果您遵循主分支指南,请确保更改其中的部分内容以匹配以下内容:

信息.plist 使用以下内容添加键和 URL 架构

    <key>branch_key</key>
    <string>key_live_******</string>
    <key>branch_app_domain</key>
    <string>9jzhz.app.link</string>
    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>branchapp</string>
            </array>
        </dict>
    </array>

应用程序代理 这里和主要指南中有一些不同的内容

#import <RNBranch/RNBranch.h>

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{   
    //  Branch
    [RNBranch initSessionWithLaunchOptions:launchOptions isReferrable:YES];

    RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
    RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge
                                                                                                    moduleName:@"BranchExample"
                                                                                        initialProperties:nil];

    rootView.backgroundColor = [[UIColor alloc] initWithRed:1.0f green:1.0f blue:1.0f alpha:1];

    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    UIViewController *rootViewController = [UIViewController new];
    rootViewController.view = rootView;
    self.window.rootViewController = rootViewController;
    [self.window makeKeyAndVisible];
    return YES;
}

- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
        if (![RNBranch.branch application:app openURL:url options:options]) {
                // do other deep link routing for the Facebook SDK, Pinterest SDK, etc
        }
        return YES;
}

- (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray *restorableObjects))restorationHandler {
        return [RNBranch continueUserActivity:userActivity];
}

确保使用您的值更新 key 、branch_app_domain 和branchapp url 方案

最重要的是:使用快速链接!

使用主链接不起作用!您必须在分支仪表板中创建快速链接,然后使用它! 我让它适用于 IOS 和 Android。

关于react-native - 分支 io 链接 +clicked_branch_link 始终为 false,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/70985741/

相关文章:

ios - iOS分支深层链接无法在设备上打开应用程序,但在模拟器上效果很好

user-interface - 如何在 React-Native-Elements 中使用 Ant Design Icon

javascript - 将输入文本连接到 slider

javascript - 读取事件监听器未在 native react 中触发

java - react native : Override Error on Package without Duplicate

ios - Branch.io 自定义网址缩短器和通用链接

ios - 如何为 Branch.io 中的链接配置自定义域

javascript - 功能性 React 组件中的全局作用域 prop

ios - 单击从 Web 应用程序共享的链接时,如何从 iOS 设备打开应用程序?

android - 如何使用 branch.io 显示排行榜(每周重置一次)