Fair在安居拍房App中的实践

随着今年政府对互联网的监管,在不少时候一个紧急需求只给1~2天整改上线,而且整改过程中需求也不是很明确,相关部门也不会给一个详细的需求文档让我们去开发,大家都是“猜测”需求的内容。在这种场景下,如果App具备动态更新的能力,会给公司减少很大的成本。面对需求不确定和紧急修改页面部分元素的能力,给予了动态化最合适的使用场景,而不只是Fix几个BUG。
Fair在58集团内的部分Flutter App中已经落地,终使集成Fair后的App获得了动态化的能力。以下文章内容主要以安居拍房App为例,介绍集成Fair的架构、业务场景所需的能力预埋,以及如何进行原生和动态化代码的维护,持续发挥Flutter的性能。
本篇文章主要介绍Fair在项目中不同场景的使用。具体的技术原理介绍,请查阅前面发布的<>和<>。

现有架构

安居拍房App是采用三端分离的混合开发模式,Flutter产物会以AAR或者Framework的方式集成到Android和iOS原生项目中。
安居拍摄App主要是记录房源信息、拍摄房源图片和VR的功能,如何把现有的Flutter能力,改造成动态代码可调用功能,就需要把网络、权限管理、图片选择、VR拍摄等能力提前预埋,定好通信协议,以便后续动态模块可以正常使用。

Fair在安居拍房App中的实践_第1张图片

能力预埋

如上一节所说,如何把一些平台能力提供给Fair动态调用,这部分工作需要提前规划和预埋。下面我们从完整界面路由预埋、动态和原始组合展示、已有组件和模版注册和第三方SDK能力扩展5个方面进行介绍。

完整界面

统一动态界面注册

FairApp(
      child: MaterialApp(
        home: ***,
        routes: {
          ***
          // Fair动态页面跳转
          'fair_page': (context) => FairWidget(
              name: _getParams(context, 'name'),
              path: _getParams(context, 'path'),
              data: {'fairProps': jsonEncode(_getData(context, _getParams(context, 'name')))}),
        },
      ),
    )

如上所示,Fair的界面调用统一注册在routes里面的fair_page来跳转,根据传入的path和参数来完成对应的动态界面的展示。

统一动态界面调用

// 动态界面
Navigator.pushNamed(context, 'fair_page', arguments: {
                'name': '动态界面 **',
                'path':
                    'assets/bundle/lib_src_page_logic-page_sample_logic_page.fair.js

你可能感兴趣的:(Fair,落地实践,flutter,android,ios)