用户界面框架适配渲染方法、装置、设备和存储介质与流程

本申请属于前端开发，特别是涉及一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质。

背景技术：

1、现有业内对不同ui(user interface，用户界面)框架的处理方案是，按照不同ui框架进行不同的代码编写。然而，现有的ui框架都是独立生态体系，无法相互兼容。这种开发方法虽然会提高开发端的开发效率，但是产品上线时可能会存在因开发端和用户端ui框架不兼容，导致用户端处无法对ui框架进行渲染。需要通过独立改造维护一个新组建，导致无法解决高效开发，择优即用的能力。因此如何提高ui框架的在用户端加载渲染时的可用性，是本领域技术人员亟待解决的技术问题。

2、前面的叙述在于提供一般的背景信息，并不一定构成现有技术。

技术实现思路

1、基于此，有必要针对上述问题，提出了一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质，能够解决用户端和开发端采用不同用户界面框架所导致的兼容性问题。

2、本申请解决其技术问题是采用以下的技术方案来实现的：

3、本申请提供了一种用户界面框架适配渲染方法，包括如下步骤：获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配；将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。

4、在本申请一可选实施例中，第一框架信息和第二框架信息不匹配，包括：第一框架信息和第二框架信息表征二者框架类型不同；或，当第一框架信息和第二框架信息表征二者框架类型相同时，获取第一框架信息的第一版本信息和第二框架信息的第二版本信息，第一版本信息和第二版本信息不兼容。

5、在本申请一可选实施例中，当第一版本信息和第二版本信息不兼容时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：根据第一版本信息和第二版本信息获取更新补丁；通过对第一用户界面代码安装更新补丁，以得到第二用户界面代码。

6、在本申请一可选实施例中，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，包括：将第一用户界面代码和第二框架信息注入预先构建的框架匹配模型；框架匹配模型根据第一框架信息和第二框架信息确定匹配关系；根据匹配关系处理第一用户界面代码以得到第二用户界面代码。

7、在本申请一可选实施例中，框架匹配模型包括标签匹配器、方法匹配器和样式匹配器；根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：标签匹配器提取出第一用户界面代码中的第一标签，并将第一标签转化为第二标签，第二标签为通用格式的标签形式；根据匹配关系处理第二标签以得到第三标签，第三标签为用户界面渲染器能够处理的形式；方法匹配器提取出第一用户界面代码中的第一方法，并将第一方法转化为第二方法，第二方法为通用格式的方法形式；根据匹配关系处理第二方法以得到第三方法，第三方法为用户界面渲染器能够处理的形式；样式匹配器提取出第一用户界面代码中的第一样式，根据匹配关系处理第一方法以得到第二样式，第二样式为用户端适用的界面形式；汇总第三标签、第三方法和第二样式，以得到第二用户界面代码。

8、在本申请一可选实施例中，根据匹配关系处理第一用户界面代码以得到第二用户界面代码，包括：根据匹配关系获取配置参数；利用配置参数对第一用户界面代码进行设置，以得到第二用户界面代码。

9、在本申请一可选实施例中，用户界面渲染器对第二用户界面代码进行处理，包括：用户界面渲染器获取执行动态匹配操作中生成的匹配参数信息，并根据第二框架信息确定用户界面渲染器渲染用户界面需采用的渲染引擎；渲染引擎根据匹配参数信息对第二用户界面代码进行解析以完成用户界面的渲染生成。

10、本申请还提供了一种用户界面框架适配渲染装置，包括：获取模块，用于获取第一用户界面代码，第一用户界面代码中包括有第一框架信息，第一框架信息用于表征开发端开发用户界面所使用的用户界面框架；获取用户界面渲染器的第二框架信息，第二框架信息用于表征用户端用户界面渲染器渲染用户界面所使用的用户界面框架；适配模块，用于当第一框架信息和第二框架信息不匹配时，对第一用户界面代码执行动态匹配操作以将第一用户界面代码处理为第二用户界面代码，第二用户界面代码的框架信息与第二框架信息匹配；渲染模块，用于将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。

11、本申请还提供了一种计算机设备，包括处理器和存储器：处理器用于执行存储器中存储的计算机程序以实现如前述的方法。

12、本申请还提供了一种计算机可读存储介质，存储有计算机程序，当计算机程序被处理器执行时实现如前述的方法。

13、采用本申请实施例，具有如下有益效果：

14、本申请能够在渲染用户框架之前，先行确定开发端的开发第一用户界面代码所使用的用户界面框架，与用户端用户界面渲染器渲染用户界面所使用的用户界面框架，两个框架间是否匹配。从而在不匹配时通过动态匹配操作将第一用户界面代码转化为能够被用户端用户界面渲染器渲染使用的第二用户界面代码。因此实现了ui框架的灵活统一，使得用户界面框架切换将更加简单便捷，无需重构多套交互用户界面，大大提高了生产效率，降低人力投入成本。

15、上述说明仅是本申请技术方案的概述，为了能够更清楚了解本申请的技术手段，而可依照说明书的内容予以实施，并且为了让本申请的上述和其他目的、特征和优点能够更明显易懂，以下特举较佳实施例，并配合附图，详细说明。应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本申请。

技术特征：

1.一种用户界面框架适配渲染方法，其特征在于，包括如下步骤：

2.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述第一框架信息和所述第二框架信息不匹配，包括：

3.如权利要求2所述的用户界面框架适配渲染方法，其特征在于，当所述第一版本信息和所述第二版本信息不兼容时，

4.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述对所述第一用户界面代码执行动态匹配操作以将所述第一用户界面代码处理为第二用户界面代码，包括：

5.如权利要求4所述的用户界面框架适配渲染方法，其特征在于，所述框架匹配模型包括标签匹配器、方法匹配器和样式匹配器；

6.如权利要求4所述的用户界面框架适配渲染方法，其特征在于，所述根据所述匹配关系处理所述第一用户界面代码以得到所述第二用户界面代码，包括：

7.如权利要求1所述的用户界面框架适配渲染方法，其特征在于，所述用户界面渲染器对所述第二用户界面代码进行处理，包括：

8.一种用户界面框架适配渲染装置，其特征在于，包括：

9.一种计算机设备，其特征在于，包括处理器和存储器；

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时实现如权利要求1到7中任一项所述方法。

技术总结
本申请实施例公开了一种用户界面框架适配渲染方法、用户界面框架适配渲染装置、计算机设备和计算机可读存储介质。其中，方法包括在第一框架信息和第二框架信息不匹配时，通过执行动态匹配操作将第一用户界面代码处理为第二用户界面代码。之后将第二用户界面代码发送至用户端，以使用户界面渲染器对第二用户界面代码进行处理，以完成用户界面的渲染生成。因此，本申请能够通过动态匹配操作将不兼容的第一用户界面代码转化为能够被用户端用户界面渲染器渲染使用的第二用户界面代码，以实现了框架统一，使得用户界面框架切换将更加简单便捷，大大提高了生产效率，降低人力投入成本。

技术研发人员：黄勇
受保护的技术使用者：平安银行股份有限公司
技术研发日：
技术公布日：2024/1/15