开发者学堂课程【mPaaS 小程序开发实战 - 教你如何独立运行小程序 :接入 mPaaS 小程序并实现启动 iOS 版】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/741/detail/13123
接入 mPaaS 小程序并实现启动 iOS 版
基于已有工程且使用 CocoaPods 接入 mPaaS 小程序并实现启动 iOS 版
如何在 iOS 客户端快速集成小程序,主要结合在 mPasS 官方文档中小程序组件下>接入 iOS >快速开始这个文档进行一个说明和介绍。
1、接入工程到 mPaaS
这里根据不同的场景结构的提供的不同功能的接入方式。主要是介绍基于已有工程且使用 CocoaPods ,首先需要准备一个基于 CocoaPods 的原生工程。
如下图,有 Podfile、workspace 的一个 CocoaPods 原生工程
有了 CocoaPods 原生工程之后,查看基于已有工程且使用 CocoaPods 的文档。首先,第一步需要安装 mPaaS 的 Cocoapods 的插件,拷贝一下插件脚本,sh < (curl-s http://mpaas-ios.oss-cn-hangzhou.aliyuncs.com/cocoapods/installmPaaSCocoaPodsPlugin.sn),
然后打开终端,直接运行这个脚本。
在运行的过程中,需要输入电脑密码,然后获取搜集者权限。
这样就完成了插件,安装完成之后执行 pod mpaas version -alugin 命令检查插件是否安装成功。如果显示版本号,就说明插件成功安装。
安装插件完成后,下一步需要在 mPaaS 的控制台创建应用并下载一个 config 的配置文件,这里使用在阿里云里的账号,然后登录 mPaaS 控制台。打开这个控制台之后可以选择创建应用,创建一个属于自己名称的 app。
这里直接复用 mPaaS Demo 的应用。
点击应用进入应用页面,在左侧栏选择初始化配置,代码配置
在 IOS 这个 type 下输入应用的 Bundle ID,设置为 com.mpaas.demo
然后点击下载配置将这个 config 文件保存到好本地,选择保存,这样就获取到 config 文件。
获取到文件之后,下一步是需要将 config 文件拷贝到工程的根目录下(与 Podfile 同级的根目录)。
下一步要在当前工程目录下,在终端执行 pod mpaas init 命令。
这个命令会自动的修改工程的 podfile 文件,podfile 文件里面会加入一些插件的配置、source 源,然后需要我们,需要手动修改 mPaaS_baseline 基线版本号,将其设置为10.1.68,修改完成后保存。
保存完成之后,就已经完成 mPaaS 的接入,接入完成后,接下来我们就可以开始添加 sdk。
2、添加 SDK
采用 Cocoapods-mPaaS 插件的方式,在 Podfile 文件中,使用 mPaaS_pod”mPaaS _TinyApp” 命令添加小程序组件依赖,添加到 Podfile 文件中。
将 mPaaS_pod”mPaaS _TinyApp” 命令放到 target 下的库中并保存
保存完成后执行 pod install 命令,在当前页面中打开终端,执行 pod install 命令。
这个工程就会从 mPaaS 的仓库里面去下载小程序组件所需要依赖的一些 SDK。首次时间较长。添加完成后如图:
完成后打开 workspace 文件
打开后可以看到在工程下添加了一个 mPaaS 目录,目录下有一些添加的相关文件
点击运行按钮即可看到工程成功运行,证明添加 SDK 操作完成。
3、使用 SDK
使用 SDK 主要分为三步:初始化配置、发布小程序、启动小程序
• 初始化配置
①容器的初始化配置
第一步:启动容器
在工程目录下获取初始化代码:
{
(void)application:(UIApplication*)applicationbeforeDidFinishLaunchingWithOptions:(NSDictionary*)launchOption
//初始化容器
[MPNebulaAdapterInterface initNebula];
}
然后在工程目录的 mPaaS 下面选择 DTFrameworklnterface +TinyAppDemo.m的 category。将初始化代码输入到类面里面就完成了初始化。
第二步,初始化完成之后,还需要进行对容器定制化的配置。重点主要是将小程序开关运营进行关闭。能在开发的过程中,使小程序的发布比较简单,所以将开发运营关闭
在工程目录下获取开关代码:
(void)application:(UIApplication*)application afterDidFinishLaunchingWithOptions:(NSDictionary*)launchOption
{
//定制容器
[MPNebulaAdapterInterface shareInstance].nebulaVeiwControllerClass=[MPH5WebViewControllerclass];
[MPNebulaAdapterInterface sharelnstance].nebulaNeedVerify = NO;
[MPNebulaAdapterInterface shareInstance].nebulaUserAgent = @"mP;
}
然后在工程目录的 mPaaS 下面选择 DTFrameworklnterface +TinyAppDemo.m 的 category。将开关代码 [MPNebulaAdapterInterface sharelnstance].nebulaNeedVerify = NO;
输入到类中将开关关闭,关闭后就完成了小程序的容器定制。
第三步,如果后台发布小程序,客户端要拉取,需要进行一个简单的请求。
//全量更新离线包
[[MPNebulaAdapterInterface shareInstance] requestAllNebulaApps:^(NSDictionary *data,NSError *error){NSLog(@"");
]];
将这个全量更新离线包的方法输入到定制容器方法下面。
这样就完成了容器的初始化配置。
②小程序配置
在 info.plist 中配置以下 App 权限(进行权限申请):
NSBluetoothAlwaysUsageDescription:蓝牙权限
NSCameraUsageDescription:相机权限
NSPhotoLibraryUsageDescription:相册权限。
NSLocationWhenInUseUsageDescription:定位权限。
打开 Info 界面进项申请
点击下图按钮进行权限申请
将上述四个权限全部录入后,这就完成了小程序权限的配置
③动态库的配置
配置动态库在10.1.68.15(含)及以上版本基线中已经取消,无需配置。
④非框架托管配置
本身的工程是实时托管的,也无需操作。
• 发布小程序
在后台发布小程序—首先需要登录控制台,选择小程序发布。
如果是一个全新的应用,是第一次使用的话,要在小程序发布和配置管理里面配置虚拟域名。
配置好域名后,就可以开始创建自己的小程序了。在左侧小程序正式包管理中,点击新建,输入小程序的 id, 也是当前小程序包唯一的标识是一个16位数字,第二栏是小程序的名称,都是自行输入便可。
新建完成小程序后,点击左侧的添加按钮,来发布前端开发者开发好的一个包
里面有一些参数需要配置,版本号第一次上传填写为1.0.0.0;客户端双端都勾选并填写范围为0.0.0.0,小程序就可以在选中的客户端上以0.0.0.0到最高版本都可使用;首次上传小程序需要自行添加一个图标;包类型为功能包;
文件是需要上传的通过小程序开发者通过 IDE 开发出来的小程序的一个包,此处使用一个 mPaaS 默认示例小程序;
主入口 URL为小程序安装包中的 appConfig.json 文件
选择文件中 page 下的一个页面 page/tabBar/component/index即可
显示底部导航栏,如果需要小程序底部有底部 type,勾选‘是’,显示右上角功能选择默认选择‘是’,之后的属性都填默认选项即可
确认上述信息无误后点击‘提交’,提交结果
小程序就上传好了,上传完成后即可进行创建发布,发布时选择正式。
状态显示为‘正式发布中’,即证明小程序发布成功
• 启动小程序
完成发布小程序后,在客户端就可以通过调用小程序或 API 打开小程序。
直接调用此 API:[MPNebulaAdapterInterface startTinyAppWithId:appId params:nil];
打开小程序。
首先打开工程,打开 helloworld 源码页面
输入以下代码添加一个按钮:
UIButton *btn = [UIButton buttonWithType:UIButtonTypeSystem];
btn.frame = CGRectMake(100,200,200,30) ;
[btn setTitle:@"打开小程序" forState:0];
[btn addTarget:self action:@selector(clickBtn) forControlEvents:UIControlEventTouchUpInside];
[self.view addsubview:btn];
添加点击事件
(void)clickBtn {
[MPNebulaAdapterInterface startTinyAppWithId:@"2018080616290001" params:nil
};
有两个参数,一个是 id(数字),另一个是一个扩展参数 params:nil,这就完成了启动小程序的配置。
重新运行工程客户端上出现‘打开小程序’按钮
点击按钮进入小程序,就会打开一个 mPaaS 官方示例的小程序
小程序内容
点击关闭按钮小程序即会退回首页