写点什么

借用 FinClip 把小程序游戏运行到自有 App 中

作者:Onegun
  • 2022-12-08
    四川
  • 本文字数:2962 字

    阅读完需:约 10 分钟

借用FinClip把小程序游戏运行到自有App中

千呼万唤始出来!FinClip 终于支持小游戏了。


我们团队算是 FinClip 的老用户了,年初就向官方提出了希望 FinClip 支持微信小游戏的建议。随着前段时间“羊了个羊”微信小游戏的爆火,官方也把小游戏支持提上了日程,近期官方开启了公测通道。我们用周末用小游戏进行了测试,记录分享一下测试情况。


  • 实现效果:将微信小游戏搬到自己的 APP 中

  • 使用技术:FinClip 小程序容器

  • 测试机:iOS

  • 测试 demo 飞机大战小游戏


以下操作均是使用 FinClip 小程序容器去实现的。iOS 端操作如下:

第一步:获取凭据( SDK KEY 及 SDK SECRET)

首先,集成 SDK 需要先在 FinClip 平台中创建应用并绑定小程序游戏应用,获得每个应用专属的 SDK KEY 及 SDK SECRET 后,随后就可以在集成 SDK 时填写对应的参数。打开小程序时 SDK 会自动初始化,并校验 SDK KEY,SDK SECRET 与 BundleID(Application ID)是否正确,这一步正确了才能初始化成功并正常使用。

1.1 创建小程序游戏

需要登录 FinClip 管理后台「应用管理-新增合作应用」,完成应用创建;

1.2 获取 SDK KEY 及 SDK SECRET

创建应用并添加 Bundle ID 后,选择对应 Bundle ID 后的「复制」,就可以导出对应的 SDK KEY 与 SDK SECRET 了。

  • SDK KEY:是合作应用能使用小程序 SDK 的凭证,如果 SDK Key 校验失败,则 SDK 的所有 Api 都无法使用。

  • SDK SECERT:是访问服务的安全证书。

第二步:集成 SDKFinClip

小程序 SDK 目前支持 pod 集成或者手动集成,此次测试我们用的是 pod 集成。


2.1 安装 pod 环境 Cocoapods

提供了一个非常简单的依赖管理系统,避免手动导入产生的错误,非常方便。官方安装指南(英文) (opens new window)或 CocoaPods 安装教程(中文) (opens new window)。

sudo gem install cocoapods
pod setup
复制代码

2.2 创建 Podfile 文件

注意从 2.8.5 版本开始,FinClip 小程序 SDK 拆分为多个 SDK:FinApplet(核心 SDK)、FinAppletExt、FinAppletBDMap、FinAppletGDMap、FinAppletWebRTC、FinAppletBLE、FinAppletAgoraRTC、FinAppletContact、FinAppletClipBoard、FinAppletWXExt。

其中只有 FinApplet 是必须的,其他扩展 SDK 可根据实际情况选择集成。

如果你不需要使用扩展 SDK,那么在 podfile 中只依赖 FinApplet 即可。如果你需要使用扩展 SDK 中的 API,那么你还需要依赖 FinAppletExt。比如:如果需要在小程序中使用蓝牙功能,可以在 podfile 中添加 FinAppletBLE 依赖。

集具体操作方法可以去详细查看官方的的文档:iOS如何引入一个SDK

2.3 安装或更新依赖

然后,执行 pod update 或者 pod install 即可。

2.4 打开工程

执行完 pod update 或者 pod install ,打开工程目录,找到 xxx.xcworkspace 文件,双击打开即可。

三、添加 SDK 头文件

在需要使用 FinClip 小程序 SDK 的地方,添加如下代码:

#import <FinApplet/FinApplet.h>
复制代码

如果还集成了扩展 SDK,那么调用扩展 SDK 中的 api,还需要加上下面的代码:

#import <FinAppletExt/FinAppletExt.h>
复制代码

当然,最方便的方式是在 pch 文件中添加以上代码,这样在使用的地方就不用再引用了。


四、初始化 SDK

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

NSMutableArray *storeArrayM = [NSMutableArray array];FATStoreConfig *storeConfig = [[FATStoreConfig alloc] init];storeConfig.sdkKey = @"您的sdkKey信息";storeConfig.sdkSecret = @"您的sdkSecret信息";storeConfig.apiServer = @"服务器域名";storeConfig.apmServer = @"apm统计事件的域名";[storeArrayM addObject:storeConfig];    FATStoreConfig *storeConfig2 = [[FATStoreConfig alloc] init];storeConfig2.sdkKey = @"您的sdkKey信息";storeConfig2.sdkSecret = @"您的sdkSecret信息";storeConfig2.apiServer = @"服务器域名";storeConfig2.apmServer = @"apm统计事件的域名";storeConfig2.cryptType = FATApiCryptTypeSM;[storeArrayM addObject:storeConfig2]; FATConfig *config = [FATConfig configWithStoreConfigs:storeArrayM];[[FATClient sharedClient] initWithConfig:config error:nil];
复制代码

本次测试需要使用微信的登录,获取用户信息等能力,因此需要进行初始化注册组件。

// 微信扩展SDL初始化[FATWXExtComponent registerComponent:@"微信appid" universalLink:@"universalLink"];
复制代码

并在 AppDelegate.m 中增加下面的代码。

- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {    /*  微信登录和分享    */    if ([WXApi handleOpenURL:url delegate:[FATWXApiManager sharedManager]]) {        return YES;    }    return YES;} // iOS 9.0 之前- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation{    /*  微信登录和分享    */    // `WeChatHandleURLDelegate ` 为 `WXApiDelegate`代理文件    if ([WXApi handleOpenURL:url delegate:[FATWXApiManager sharedManager]]) {        return YES;    }    return YES;} - (BOOL)application:(UIApplication *)application handleOpenURL:(NSURL *)url{    /*  微信登录和分享    */    if ([WXApi handleOpenURL:url delegate:[FATWXApiManager sharedManager]]) {        return YES;    }    return YES;} - (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler {  return [WXApi handleOpenUniversalLink:userActivity delegate:[FATWXApiManager sharedManager]];}
复制代码

五、handleOpenURL 处理

一般来说小游戏都需要支持外部通过链接打开,便于分享。则需要做如下处理。

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url sourceApplication:(NSString *)sourceApplication annotation:(id)annotation{    if ([[FATClient sharedClient] handleOpenURL:url]) {        return YES;    }    return YES;} - (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options{    if ([[FATClient sharedClient] handleOpenURL:url]) {        return YES;    }    return YES;}
复制代码

六、打开小程序

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(@"关闭小游戏");}];
复制代码

打开效果如下:



本次测试使用的是官方给到的 demo,整体流程跑下来是比较顺利的,没有遇到特别卡壳的地方,目前官方正在做内测,感兴趣的朋友都可以去官方平台看看。

小游戏开发指南

接下来,安卓系统我们打算使用自己的小游戏再跑一次流程,届时再给大家做分享。

发布于: 刚刚阅读数: 4
用户头像

Onegun

关注

这个Coder不太Cold 2021-08-25 加入

前端划水第一名🥇

评论

发布
暂无评论
借用FinClip把小程序游戏运行到自有App中_小游戏_Onegun_InfoQ写作社区