快速构建自有 App 的小程序生态

2,157 阅读5分钟

这两天体验了一款前端容器类的 SaaS 工具,可以支持在自己的 App 里面扩展类似微信得小程序能力,整体体验下来还是很不错的,可以很大程度上帮助我们扩展 App 的生态。

我们目前看到的具有小程序的 App,基本上是大厂的超级 App,例如微信、支付宝、头条、百度这几个 APP。似乎中小企业没法做小程序的扩展,但是接触到了 FinFlip 后,发现他们已经将这块工具化了,直接可以像使用 SaaS 服务一样完成我们 App 的小程序能力建设。

在这里先简单介绍一下 ,FinClip 是凡泰极客推出的小程序容器技术,一个可以让任何APP都能具备小程序运行能力的前端容器技术,只需简单集成 FinClip SDK ,即可在 iOS、Android、Windows、Linux、macOS甚至是国产操作系统等平台下的应用中运行我们的小程序,这意味着,移动端、PC 端、车载设备、智能电视、智能手表都能运行小程序了。同时,FinClip还提供一个后台管理系统,统一管理小程序的上架和下架。

话不多说,我把体验得过程贴出来,大家有兴趣的可以去他们官网注册账号体验一下。

第一步:创建小程序

登录到后台后,找到小程序管理菜单,新增一个小程序(目前免费最多支持99个小程序)。

image.png

第二步:下载 IDE,开发小程序

下载他们官方的开发工具 FinClip IDE,这是一款和微信开发者工具基本一致的开发工具,完全兼容微信小程序的语法 WXML,无需使用第三方跨端跨框架解决方案,即可编译运行已有微信小程序代码,体验效果与微信小程序基本一致。 在这个 FIDE 里面,我们可以对现有项目进行二次开发,扩展功能和接口,同时它还支持小程序一键转换成APP,可以将已有小程序代码导出为 IOS 与 Android 中可用的工程文件,由于导出的工程文件已经集成了 FinClip SDK ,所以直接拥有小程序的运行能力,后续可在这个 APP 上继续上架更多小程序,自建自己的小程序生态。 此外,IDE 中还包含各类扩展插件和接口(支付、人脸识别、音视频、OCR等),我们可勾选所需的支持插件,从而增强所生成App原生能力。

我们在 IDE 里创建一个项目,然后选择刚刚创建的小程序,选择小程序示例模板,然后就进入到编译环节。

image.png

编译成功,可以看到预设的小程序模板,我们换个图片看看。

image.png

把首页的 logo 图片换成 Flutter 的 Logo,打上“岛上码农”的标题,完成编译后就可以在左侧预览到最新的效果了。

image.png

上传发布

点击 IDE 顶部的上传按钮,会将编译后的代码包上传到后台,输入版本号,本次版本更新说明即可提交。

image.png

上传成功后,我们可以在小程序的代码包里看到刚刚上传的内容。

image.png

然后进行添加审核版 —> 审核 -> 上架操作(实际上如果是第三方的应用则需要我们运营人员审核),就可以在 App 里体验小程序了。这里我用的是他们官方得 App 体验的,实际我们可以在自己的 App 里集成 SDK 支持在自己的 App里启用小程序功能。

image.pngimage.png

其他能力

微信小程序支持微信登录,那么在 FinClip 上架的小程序在不修改代码得情况也能具备用 微信登录 能力,可基于微信生态建立对应的用户登录体系。

使用微信登录需要 将由 FinClip 设计的小程序授权页面增加至已有的小程序代码包之中并提交审核,随后将关联的微信小程序的原始 ID,授权页面链接分别填入「关联微信登录」弹窗进行关联,当用户打开非微信平台小程序时,如需要调用登录体系,则会引导用户打开微信查看对应页面进行授权,由 FinClip 完成用户登录数据同步。

这样下来,我们的 APP 就可以快速引入微信生态中的小程序商家,对开发者也没有增加其他门槛。

版本

目前 FinClip的 SaaS 版对功能没有限制,支持99个小程序和每个月10000次的免费发布额度,对于前期探索业务来说基本是够用的了。他们也提供私有化部署的订阅版和企业版,感兴趣的同学可以尝试体验一下。

后记

以前感觉中小企业 App 内扩展功能只能靠自己开发,如果搭建第三方应用更多考虑的是 H5 的方案。然而,H5的一方面体验不好,另一方面是合作方目前更多地转成了小程序,也不太可能给我们单独搞 H5。FinClip 这种方案,可以直接将合作方的微信小程序转换为我们自己 App 里的小程序,还是非常不错的。其实,这也是给我们开发者一个启发,除了业务类的应用之外,给互联网软件开发人员提供效率工具,避免大家内卷造轮子也是很不错的一个方向。