FinClip为企业提供小程序生态圈技术产品,开发者可在FinClip小程序开发帮助中心找到相关FinClip小程序指引

# SDK 集成指南

集成指引

FinClip 分别提供了在 iOSAndroidFlutterReact Nativeuni-app 以及桌面端环境中集成引入 SDK 的操作方法。您可以点击蓝色链接跳转查看详情。

# 1. iOS 快速集成

# 1.1 修改Podfile文件,增加FinApplet依赖

source 'https://github.com/CocoaPods/Specs.git'
pod 'FinApplet'

# 1.2 初始化SDK

在工程的 AppDelegate 中的以下方法中,调用 SDK 的初始化方法。

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
	
    FATStoreConfig *storeConfig = [[FATStoreConfig alloc] init];
    storeConfig.sdkKey = @"这里填上的SDK Key";
    storeConfig.sdkSecret = @"这里填上SDK secret";
    storeConfig.apiServer = @"这里填上你们的服务器地址"; // 例如:https://api.finclip.com;
    FATConfig *config = [FATConfig configWithStoreConfigs:@[storeConfig]];
    
    [[FATClient sharedClient] initWithConfig:config error:nil];
    
    return YES;
}

# 1.3 打开小程序


FATAppletRequest *request = [[FATAppletRequest alloc] init];
request.appletId = @"小程序id"; // 必填项
request.apiServer = @"服务器地址"; // 必填项
request.transitionStyle = FATTranstionStyleUp;
request.startParams = startParams;
    
[[FATClient sharedClient] startAppletWithRequest:request InParentViewController:self completion:^(BOOL result, FATError *error) {
    NSLog(@"打开小程序:%@", error);
} closeCompletion:^{
    NSLog(@"关闭小程序");
}];

提示

  • SDK KEY 和 SECRET 可以从社区版的管理后台中获取;
  • apiServer 为当前小程序后端的服务地址,也即前文所输入的IP:端口
  • 小程序id 为在管理后台上架的小程序唯一ID(在小程序上架时自动生成);
  • 上述的参数可以在前文服务器部署的后台界面上获取,也可以在没有部署服务端的情况下在 FinClip 官网 (opens new window) 注册体验;
  • 关于 SDK 集成的具体方法,请参考 iOS集成 文档;
  • 重要事情说四遍,您可以在官方的 Github 仓库 (opens new window)中查看示例代码;
  • 请注意 APP 的Bundle Id 需要与管理后台中添加的保持一致,可在【企业端-应用管理】中查看。

# 2. Android 快速集成

# 2.1 在工程的build.gradle中需要配置的内容

在工程的build.gradle中添加maven仓库的地址:

buildscript {
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath "com.android.tools.build:gradle:3.5.2"
        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:1.3.60"
    }
}
allprojects {
    repositories {
        google()
        jcenter()
        maven { url "https://jitpack.io" }
        maven {
            url "https://gradle.finogeeks.club/repository/applet/"
            credentials {
                username "applet"
                password "123321"
            }
        }
    }
}

# 2.2 在gradle中依赖SDK

implementation 'com.finogeeks.lib:finapplet:+'

# 2.3 配置混淆规则

集成SDK之后,为了避免 SDK 中部分不能被混淆的代码被混淆,需要在工程的混淆规则配置文件中增加以下配置:

-keep class com.finogeeks.** {*;}

# 2.4 SDK初始化

我们强烈建议在Application中对SDK进行初始化,初始化SDK需要传入的各项参数如下:

FinAppConfig config = new FinAppConfig.Builder()
        .setAppKey("SDKKEY")
	      .setAppSecret("SECRET")
        .setApiUrl("https://api.finclip.com")
        .setApiPrefix("/api/v1/mop/")
        .setGlideWithJWT(false)
        .build();
FinCallback<Object> callback = new FinCallback<Object>() {
    @Override
    public void onSuccess(Object result) {
        // SDK初始化成功
    }

    @Override
    public void onError(int code, String error) {
        // SDK初始化失败
        Toast.makeText(AppletApplication.this, "SDK初始化失败", Toast.LENGTH_SHORT).show();
    }

    @Override
    public void onProgress(int status, String error) {

    }
};
FinAppClient.INSTANCE.init(this, config, callback);

SDK采用多进程机制实现,每个小程序运行在独立的进程中,即一个小程序对应一个进程。在初始化SDK时,要特别注意的一点是:小程序进程在创建的时候,不需要执行任何初始化操作,即使是小程序SDK的初始化,也不需要在小程序进程中执行。

举个例子🌰

应用使用了一些第三方库,这些库需要在应用启动时先初始化,那么在 Application 中执行初始化时,只有当前进程为宿主进程时才需要初始化这些第三方库,小程序进程是不需要初始化这些库的。

因此,在初始化SDK之前,一定要判断当前进程是哪一个进程,如果是小程序进程,就不进行任何操作了:

if (FinAppClient.INSTANCE.isFinAppProcess(this)) {
    return;
}

# 2.5 打开小程序

FinAppClient.INSTANCE.getAppletApiManager().startApplet(this, "appid");

提示

  • SDK KEY 和 SECRET 可以从社区版的管理后台中获取;
  • apiServer 为当前小程序后端的服务地址,也即前文所输入的IP:端口
  • 小程序id 为在管理后台上架的小程序唯一ID(在小程序上架时自动生成);
  • 上述的参数可以在前文服务器部署的后台界面上获取,也可以在没有部署服务端的情况下在 FinClip 官网 (opens new window) 注册体验;
  • 关于 SDK 集成的具体方法,请参考 Android集成 文档;
  • 重要事情说四遍,您可以在官方的 Github 仓库 (opens new window)中查看示例代码;
  • 请注意 APP 的Bundle Id 需要与管理后台中添加的保持一致,可在【企业端-应用管理】中查看。

# 3. Flutter 快速集成

FinClip 提供了Flutter SDK,支持在 Flutter 环境使用小程序;以满足 Flutter 和小程序混编的效果。

# 3.1 引入插件

引入小程序引擎插件。在 pubspec.yaml 文件中引入小程序 Flutter 插件

mop: ^0.5.0

# 3.2 初始化引擎

在 main.dart 文件中增加以下小程序引擎初始化方法。
在 Mop.instance.initialize 中,需要用到 SDK KEY 和 SECRET。

// Platform messages are asynchronous, so we initialize in an async method.
  Future<void> init() async {
    if (Platform.isIOS) {
      final res = await Mop.instance.initialize(
          'SDKKEY', 'SECRET',
          apiServer: 'https://api.finclip.com', apiPrefix: '/api/v1/mop');
      print(res);
    } else if (Platform.isAndroid) {
      final res = await Mop.instance.initialize(
          'SDKKEY', 'SECRET',
          apiServer: 'https://api.finclip.com', apiPrefix: '/api/v1/mop');
      print(res);
    }
    if (!mounted) return;
  }

# 3.3 打开小程序

Mop.instance.openApplet('appid');

提示

  • SDK KEY 和 SECRET 可以从社区版的管理后台中获取;
  • apiServer 为当前小程序后端的服务地址,也即前文所输入的IP:端口
  • 小程序id 为在管理后台上架的小程序唯一ID(在小程序上架时自动生成);
  • 上述的参数可以在前文服务器部署的后台界面上获取,也可以在没有部署服务端的情况下在 FinClip 官网 (opens new window) 注册体验;
  • 关于 SDK 集成的具体方法,请参考 Flutter集成 文档;
  • 重要事情说四遍,您可以在官方的 Github 仓库 (opens new window)中查看示例代码;
  • 请注意 APP 的Bundle Id 需要与管理后台中添加的保持一致,可在【企业端-应用管理】中查看。

# 4. ReactNative 快速集成

FinClip 提供了 ReactNative SDK,支持在 ReactNative 环境使用小程序。以满足 ReactNative 和小程序混编的效果。

# 4.1 引入插件

引入小程序引擎插件。

在 package.json 文件中引入小程序 ReactNative 插件

"react-native-mopsdk": "^1.0.1"

# 4.2 初始化引擎

在 main.dart 文件中增加以下小程序引擎初始化方法。
在Mop.instance.initialize 中,需要用到 SDK KEY 和 SECRET。

import MopSDK from 'react-native-mopsdk';
// 1. mop初始化
MopSDK.initialize({
    appkey: '22LyZEib0gLTQdU3MUauASlb4KFRNRajt4RmY6UDSucA',
    secret: '4a915e447bcbd439',
    apiServer: 'https://api.finclip.com',
    apiPrefix: '/api/v1/mop'
  }, (data) => {
    console.log('message;', data);
  });

# 4.3 打开小程序

MopSDK.openApplet('appid','','',(data)=>{});

提示

  • SDK KEY 和 SECRET 可以从社区版的管理后台中获取;
  • apiServer 为当前小程序后端的服务地址,也即前文所输入的IP:端口
  • 小程序id 为在管理后台上架的小程序唯一ID(在小程序上架时自动生成);
  • 上述的参数可以在前文服务器部署的后台界面上获取,也可以在没有部署服务端的情况下在 FinClip 官网 (opens new window) 注册体验;
  • 重要事情说四遍,您可以在官方的 Github 仓库 (opens new window)中查看示例代码;
  • 请注意 APP 的Bundle Id 需要与管理后台中添加的保持一致,可在【企业端-应用管理】中查看。
© 2022 FinClip with ❤

👋🏻 嘿,你好!

「FinClip」是一套基于云原生框架设计的小程序容器。能够让任何移动应用在集成小程序SDK之后,获得可用、安全的小程序运行能力。

>> 点我免费注册体验

查看产品文档
了解与 FinClip 相关的一切信息

产品博客 👈  了解产品更新与核心功能介绍
资源下载 👈  获取小程序 SDK 与开发工具
文档中心 👈  查询 FinClip 小程序开发指南与答疑

商务咨询热线
预约 FinClip 产品介绍,咨询商务报价或私有化部署事宜

400-066-00210755-86967467

获取产品帮助
联系 FinClip 技术顾问,获取产品资料或加入开发者社群

联系线上
人工客服

或 👉  点击这里,提交咨询工单