利用小程序容器技术发布你的App应用

提及小程序，大家首先想到的肯定是微信小程序，其实回顾微信第一批小程序上线已经是6年前。 2017 年 1 月 9 日 0 点微信第一批微信小程序正式上线，用户可以体验到各种各样微信小程序提供的服务。回到现在，日常生活中使用小程序场景已经不仅限于微信，支付宝、头条、百度、抖音、美团等App都有小程序的运行能力。越来越多的大厂都在使用这种技术，说明这种架构是有一定的优势和特点。

小程序类似传统的 Hybrid 架构，通过 Native 组件来实现某些功能，以弥补传统 Web 页面性能上的不足，让小程序能达到原生体验的效果。

• 大厂的领头，带动大量的商家及公司入场
• 小程序无需下载，需要的时候随时用
• 用户体验好，能达到原生App的体验效果
• 开发成本低，前端开发一套代码运行在ios安卓两端

以上列举了一部分小程序的优势，当然除此之外也还是有一定的门槛。大厂都在用，但是都未开放这一小程序运行能力，如果想要在自家的App中使用类似的效果还是有一定的难度。但是回看上面的各种优点这件事确实是值得去做的，节省成本也提升用户的体验。

现在世面上也推出了相关类似的技术，通常称之为小程序容器技术。其中比较有代表性的主要有以下三个方向：

• Finclip小程序开放平台
• 阿里mpaas移动开发平台
• UniSDK

今天主要介绍的是目前在Github上热门的前端容器技术 - FinClip。以下是百度百科介绍：

FinClip 是深圳凡泰极客科技有限公司研发的小程序容器技术，不论是移动 App，还是电脑、电视、车载主机等设备，在集成FinClip 小程序 SDK之后，都能快速获得运行小程序的能力。 提供了 100% 自主知识产权的小程序 SDK和小程序管理后台，开发者可以将已有的小程序迁移部署在自有 App中，从而获得足够灵活的小程序开发与管理体验

简单来说，FinClip推出的小程序容器技术。只需要集成SDK，就可以让任何应用程序都支持小程序的运行能力。这意味着你可以在各种平台的应用程序中运行你的小程序，包括电脑、移动设备、车载设备、智能电视和智能手表。

移动 App 集成 FinClip SDK 后，安装包的体积仅仅增大了不到 3MB，这能让现有的前端代码立马就可以调用小程序原生相关的能力。如果这相关的能力要让现有的原生同事开发，这个周期是极长且成本很高。对于一些创业型公司需要马上投入到市场验证效果是比较合适。当然如果公司人力和成本很足够，完全自研开发也是可行的。

他们自主研发了一款小程序IDE开发工具，界面与微信小程序的开发工具类似，具有自带调试和真机预览的功能。下图是IDE开发工具的界面，对于有微信小程序开发经验的开发者来说，上手非常容易。此外，开发工具还扩展支持导入导出生成App。开发者可以利用IDE开发工具中的生成App功能，将已有小程序代码快速导出为iOS与Android中可用的安装包。这样开发者无需掌握完善的移动应用开发与打包技能，只需将主要精力放在小程序的产品设计与功能实现上。开发者可以将现有的小程序上架到各大应用商店中。

上图展示的内容是我将一个现有的微信小程序导入的样子，整个过程不需要额外修改代码，运行效果和在微信上面保持一致，运行及编译的过程很流畅。通过开发工具的预览生成二维码，然后用它们的app扫码即可体验你的小程序了。对于有需求将微信小程序移植到App的场景可以大大的节省人力成本，下图是我的小程序运行在它们app中的效果，运行起来的那一刻简直惊呆了我，整个操作体验和在微信中没有什么区别，流程丝滑，原生般的体验。

然后还体验了一下小程序生成app的过程，首先要通过IDE开发工具进行一系列的参数配置，包括基础配置，图标，启动闪屏，URL Scheme，权限，SDK等。

然后后会出现功能的介绍及提示，这里直接点击下一步即可。

这里会提示选择打包的方式，可以选择云打包和本地编译，如图所示，本地编译适合有原生开发基础的用户选择，因为打包后还需要在本地的开发工具中举行最终编译成App，接下来我们先看看云打包的过程。

这一步的前提需要将小程序提交到Sass平台审核通过，这里才可以选择到对应的小程序

这一步涉及的配置比较多，需要提前在Sass平台创建好相关的应用，新增 bundleId，并关联刚刚已经审核上架的小程序。到这里准备工作就已经完成了，下面开始进行打包App。

由于证书与 BundleID 之间是一一对应关系，因此打包之前需要上传打包证书。

上传完证书提交下一步就进入到云打包的任务中了，通过查看打包任务进度，点击右侧「下载安装包」即可获得对应的app安装文件。

以上是通过云打包的过程，对于没有本地环境和原生开发经验的同学比较适合，对于有原生相关开发经验的同学可以尝试本地打包。选择本地打包时，选择对应的小程序和app信息后，选择导出目录即可开始生成App了。

整个生成的过程也是很快，对于这两种方式大家可以根据自身的情况进行选择。

最后是部署相关，对于还在创业阶段的团队直接使用Saas平台就够用了，如果是企业级应用还是推荐私有化部署。FinClip 现在SaaS/私有化部署都行，真正的开箱即用，SaaS版每月拥有 10,000 次免费发布调用，感兴趣的朋友可以用自己的项目尝试体验一下。

简而言之，FinClip是一款小程序容器技术，通过集成FinClip小程序SDK，开发者可以快速实现在自有应用中运行小程序的能力。FinClip提供了小程序SDK和小程序管理后台，可实现灵活的小程序开发与管理。

此外，FinClip兼容微信小程序语法，无需学习新的语法和框架，使用FinClip IDE、小程序管理后台和小程序开发文档即可完成开发测试、预览和部署等工作。通过将微信小程序转换为App，将小程序嵌入现有的原生应用中，可以大幅提升用户体验。建议有兴趣的朋友亲身体验一下。

看完本文如果觉得有用，记得点个赞支持，收藏起来说不定哪天就用上啦～

专注前端开发，分享前端相关技术干货，公众号：南城大前端（ID: nanchengfe）