手把手系列:如何将小程序游戏引入自有APP?(iOS篇)

news2024/12/26 2:51:41

自FinClip  诞生以来,一直有不少开发者询问官方 FinClip 什么时候可以支持微信小游戏?实际上,从去年开始我们就把支持微信小游戏的计划做进了产品的 Roadmap。2022年底,我们终于在新年之前实现了对小游戏的支持!

近期,我们将面向开发者们发起产品公测!我们诚挚的邀请各位来参与FinClip  支持小游戏的内测体验活动,欢迎大家来试用、拍砖。By the way,官方也为参与公测的大家准备了丰富的礼物~敬请期待!

言归正传,本期手把手系列将为大家演示将小程序游戏引入自有app的操作流程!

实现效果在自有 App 中实现小程序游戏运行
使用技术FinClip 小程序容器
测试机iOS
测试demo飞机大战小游戏
在 iOS 项目中引入 FinClip SDK ,实现小程序游戏在App中运行,操作如下:

第一步:获取凭据( 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

新增应用后,可以展开应用名称,在下方的列表中点击「添加 BundleID」,在出现的弹窗中输入需要绑定应用的 BundleID。

配置 BundleID

完成 BundleID 的填写,并点击确定按钮后,您会看到如上图所示的界面。其中的SDK KEY,SDK SECRET与API SERVER是您在集成小程序 SDK 时需要要到的凭据。

⚠️请注意:

  • SDK KEY:是合作应用能使用小程序 SDK 的凭证,如果 SDK Key 校验失败,则SDK 的所有 Api 都无法使用。
  • SDK SECERT:是访问服务的安全证书,不要给第三方。

第二步:集成 SDK

FinClip 小程序 SDK 目前支持pod集成或者手动集成。此次操作仅介绍pod集成方式。更多详细内容可以查看官方文档。

2.1安装pod环境

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

sudo gem install cocoapods
pod setup

2.2 创建Podfile文件

如果你不需要使用扩展 SDK,那么在podfile中只依赖FinApplet.framework即可。如果你需要使用扩展 SDK 中的 API,那么你还需要依赖FinAppletExt.framework.

注意:从2.8.5版本开始,FinClip 小程序 SDK 拆分为多个SDK:FinApplet(核心SDK)FinAppletExtFinAppletBDMapFinAppletGDMapFinAppletWebRTCFinAppletBLEFinAppletAgoraRTCFinAppletContactFinAppletClipBoardFinAppletWXExt

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

2.3 安装或更新依赖

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

2.4 打开工程

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

3. 增加权限描述

根据您的实际需求,集成响应的SDK,并在工程info.plist文件中增加权限配置

如果您集成所有的 SDK,那么需要配置的权限包括:相册、相机、麦克风、位置、蓝牙、通讯录。这些权限,全都是调用相应的api和组件时才会触发。

第三步:添加SDK头文件

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

#import <FinApplet/FinApplet.h>

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

#import  <FinAppletExt/FinAppletExt.h>

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

第四步:初始化 SDK

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

NSString *plistPath = [[NSBundle mainBundle] pathForResource:@"servers" ofType:@"plist"];
NSArray *array = [NSArray arrayWithContentsOfFile:plistPath];
NSMutableArray *storeArrayM = [NSMutableArray array];
for (NSDictionary *dict in array) {
    FATStoreConfig *storeConfig = [[FATStoreConfig alloc] init];
    storeConfig.sdkKey = dict[@"sdkKey"];
    storeConfig.sdkSecret = dict[@"sdkSecret"];
    storeConfig.apiServer = dict[@"apiServer"];
    storeConfig.apmServer = dict[@"apmServer"];
    if ([@"SM" isEqualToString:dict[@"cryptType"]]) {
        storeConfig.cryptType = FATApiCryptTypeSM;
    } else {
        storeConfig.cryptType = FATApiCryptTypeMD5;
    }
    
    [storeArrayM addObject:storeConfig];
}
FATConfig *config = [FATConfig configWithStoreConfigs:storeArrayM];
[[FATClient sharedClient] initWithConfig:config error:nil];

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

// 准备扩展api
[[FATExtClient sharedClient] fat_prepareExtensionApis];

并在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(@"关闭小程序");
}];

其他关于 FinClip 小程序 SDK 的 API介绍,请查看 API 说明文档。

打开效果如下:

各位开发者可以上手试试看,有任何问题都可以向官方提出哦!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/95485.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

中文输入法中光标跟随能力触发的浏览器事件探究

:::tip 最近在着手腾讯文档的输入体验优化&#xff0c;在其中有一个不起眼的小需求引起了我的注意&#xff0c;并顺便研究了一些事件监听机制相结合的特点&#xff0c;特此记录一下填坑过程。 ::: 模拟光标跟随 大部分的主流输入法都有这样一个特性&#xff0c;在输入中文时&…

昆仑天工开源的AIGC

🍿*★,*:.☆欢迎您/$:*.★* 🍿 https://github.com/SkyWorkAIGC/SkyCode 技术优势一 :涵盖多种编程语言 不同的编程语言着重于解决不同平台、环境下的问题,不同的编程语言都有自己存在的理由。奇点智源SkyCode能够生成的代码,不仅包括使用广泛的JavaScript、python、Jav…

(六)springcloud之Nacos集群与持久化配置-3

模块&#xff1a; 1.父工程&#xff08;管理版本&#xff09; 2.公共模块&#xff1a;Common-API 3.测试模块&#xff1a;NacosClusterConfigConsumer80 版本&#xff1a; springboot:2.7.6 springcloud:2021.0.5 spring-cloud-alibaba-dependencies:2021.0.1.0 nacos:2.1.2 ng…

RCFSNet

搬来了一种结合道路上下文信息与多尺度特征的道路遥感图像道路提取方法&#xff0c;与常见的道路提取算法相比&#xff0c;RCFSNet能够获取完整的路网标签&#xff0c;在遮挡场景中表现出色 本人是太原理工大学大数据学院在2022年发表在《IEEE Geoscience and remote sensing …

SpringBoot网站开发常用工具类(自己写的适合入门)

目录 字符集转换工具 适用 代码 JWT工具类 适用 代码 七牛云文件上传工具类 适用 代码 文件类型转换工具类 适用 代码 session&#xff0c;cookie工具类 适用 代码 字符集转换工具 适用 主要是完成与前端配合&#xff0c;共同实现特殊字符串传输过程中被转译的问…

数字藏品系统应用场景介绍——元宇宙NFG

数字藏品系统应用场景&#xff1a; 1.虚实结合产品营销&#xff1a;品牌企业限量发行产品&#xff0c;比如限量珍藏版产品&#xff0c;茅台酒&#xff0c;耐克鞋&#xff0c;劳力士手表&#xff0c;爱马仕包包&#xff0c;钻石珠宝&#xff0c;结合元宇宙热点营销&#xff0c;…

Crane 发布国内首个云原生应用碳排放计算优化器

为了共同应对气候变化挑战&#xff0c;减缓全球变暖趋势&#xff0c;2015年12月&#xff0c;近200个缔约方共同通过了《巴黎协定》&#xff08;The Paris Agreement&#xff09;&#xff0c;对2020年后全球如何应对气候变化做出了行动安排。为实现这一目标&#xff0c;全球多个…

我国液化石油气行业SWOT分析:产销规模持续上涨 供需缺口劣势明显

液化石油气是在炼油厂内&#xff0c;由天然气或者石油进行加压降温液化所得到的一种无色挥发性液体,它极易自燃&#xff0c;当其在空气中的含量达到了一定的浓度范围后&#xff0c;它遇到明火就能爆炸。 一、优势分析 根据观研报告网发布的《中国液化石油气市场发展深度分析与…

【Unity】UI ToolKit 学习记录

Unity推出的这个 UI ToolKit&#xff0c;据说是要用来替代UGUI。既然这么有野心&#xff0c;那肯定要搞来看一看。这次使用目标就是用这个 UI ToolKit 生成一堆类似HUD的头标&#xff0c;然后看看使用难易程度和性能如何。 本文对应Unity版本 &#xff1a;2020.3.41f1c1 1、安装…

四十六——五十一

四十六、JavaScript——对象 一、对象 数据类型&#xff1a;原始值&#xff1a; 1. 数值 Number 2. 大整数 BigInt 3. 字符串 String 4. 布尔值 Boolean 5. 空值 Null 6. 未定义 Undefinded 7. 符号 Symbol 除了七种原始值之外&#xff0c;后面所用到的数据类型&#xff0c;都…

吐槽嫌弃测试周期太长?开发自测一下

互联网产品竞争激烈&#xff0c;在生存的巨大压力之下&#xff0c;策划和运营人员们恨不得每一个需求都能秒级上线&#xff0c;这就给研发团队带来了巨大的压力。 有时候&#xff0c;产品的老大很关注某一个功能点&#xff0c;希望能尽快上线&#xff0c;可是&#xff0c;他发…

基于nodejs电影售票后台管理的设计和实现.zip(论文+源码+ppt文档+视频录制)

相关资料下载地址&#xff1a;请点击下载》》》 一、 项目介绍 5 二、 需求分析 6 1、 前端需求 6 2、 后端需求 6 3、 开发环境 7 三、 技术介绍 7 1、 Vue 7 2、 ElementUI 7 3、 NodeJS 7 4、 MySQL 8 四、 功能实现 8 1、 前端服务构建 8 2、 前端API接口封装 8 3、 前端路…

技术分享 | 掌握高频 Docker 命令,夯实内功基础

本文为霍格沃兹测试学院学院学员 Docker 实战课程学习笔记&#xff0c;供各位同学参考。 在 Dokcer 横空出世之前&#xff0c;应用打包一直是大部分研发团队的痛点。在工作中&#xff0c;面对多种服务&#xff0c;多个服务器&#xff0c;以及多种环境&#xff0c;如果还继续用传…

我的头条四面:测试工程师调岗测试开发工程师,发生了什么?

早就听说头条是算法大厂手撕代码恐怖如斯&#xff0c;进入玻璃房之前做好了心理准备&#xff0c;本次头条面试总共是四面&#xff0c;一二三技术面HR面&#xff0c;总体感觉也还不错&#xff0c;面试的是测试工程师&#xff0c;最后拿到的offer却是测试开发工程师&#xff0c;从…

Mysql主从同步时Slave_SQL_Running状态为Yes , 但是Slave_IO_Running状态为Connecting以及NO的情况故障排除

1. 环境说明 主机IP : 192.168.154.146 从机1IP : 192.168.154.147 从机2IP : 192.168.154.148 2.故障记录 当使用Navicat工具打开这三个数据库时 , 发现主库和从库的数据不同 3.排查过程-(Slave_IO_Running状态为Connecting) 3.1 网络是否互通 互ping三台机器 , 看机器…

Python自由职业可以做什么?副业月入3000的快乐你根本想象不到

很多有时间的程序员都会在业余时间接一些“私活”&#xff0c;也就是我们说的副业&#xff01; 毕竟虽然程序员加班时间长&#xff0c;但是也不是所有程序员都是需要997的…许多事业编制或者说一部分公司并不会出现特别夸张的加班时长。平常周末的时候也就会接一些副业&#x…

如何用Python操作PDF制作数据报告?

大家好&#xff0c;你是否会发现 Python 操作PDF文档内容&#xff0c;主要围绕PDF文档的内容提取、合并与拆分、加密与解密、添加水印以及不同文档格式相互转换来展开。 但大家会发现&#xff0c;其中并没有有太多直接操作PDF并向其写入的内容。这是因为我们更推荐大家Python自…

C语言练习之计算一个数的每位之和(递归实现)

目录 前言 一、思路 二、源代码以及运行截图 源代码&#xff1a; 运行截图&#xff1a; 总结 前言 写一个递归函数DigitSum(n)&#xff0c;输入一个非负整数&#xff0c;返回组成它的数字之和 例如&#xff0c;调用DigitSum(1729)&#xff0c;则应该返回1 7 2 9&#…

LeetCode HOT 100 —— 297.二叉树的序列化与反序列化

题目 序列化是将一个数据结构或者对象转换为连续的比特位的操作&#xff0c;进而可以将转换后的数据存储在一个文件或者内存中&#xff0c;同时也可以通过网络传输到另一个计算机环境&#xff0c;采取相反方式重构得到原数据。 请设计一个算法来实现二叉树的序列化与反序列化。…

你还以为格子衫头发的就是程序员?这些特征都没有别说你是程序员

周一写几百个bug&#xff0c;周二到周四拼命改bug&#xff0c;周五总结bug&#xff0c;总结的好有周末&#xff0c;总结的不好周末无休&#xff01; 咳咳&#xff0c;这样的周末我可以不休息&#xff01; 有很多想要学习Python却找不到途径的朋友&#xff0c;我这里整理了一…