基于应用运行时动态引入Web组件的处理方法及装置与流程

专利2025-06-11  145


本发明涉及代码开发,尤其涉及一种基于应用运行时动态引入web组件的处理方法及装置。


背景技术:

1、本部分旨在为权利要求书中陈述的本发明实施例提供背景或上下文。此处的描述不因为包括在本部分中就承认是现有技术。

2、目前web组件化开发的现状是:随着web开发技术的飞速发展,web开发极大地依赖于组件化开发方法,以提高开发效率和代码复用性。组件化不仅促进了开发流程的标准化,也使得管理和维护大型web应用变得更加容易。目前主流的组件开发与使用方法为:开发方通过开发/发布npm包,使用方通过npm引入后使用。npm依赖引入通常发生在项目的构建阶段,开发者通过命令将需要的javascript库或框架添加到项目中。这些依赖被记录在package.json文件中,随后可以通过构建工具将这些依赖打包到最终的应用中,这意味着组件是在构建阶段被打包进应用,导致开发web应用耗时耗力、不灵活且不稳定的问题。


技术实现思路

1、本发明实施例提供一种基于应用运行时动态引入web组件的处理方法,用以在web应用运行时根据用户的不同需求和应用的不同状态动态地加载和渲染不同版本的webcomponent组件,该方法包括:

2、在web应用运行时,获取用户对web component组件的需求和web应用的不同状态;

3、根据用户对web component组件的需求和web应用的不同状态,从预先建立有webcomponent组件库的服务器中,确定出当前web component组件对应的版本标识和组件脚本文件;所述web component组件库中预先存储有不同用户需求和web应用的不同状态对应的多个web component组件,以及每一组件对应的版本标识及组件脚本文件;

4、根据预设组件版本策略,以及当前web component组件对应的版本标识,动态加载当前web component组件对应的组件脚本文件;所述组件版本策略为:根据预设加载组件函数的处理逻辑,动态引入组件版本及动态渲染对应组件版本的策略;

5、根据所述预设组件版本策略,在预设页面动态渲染展示当前web component组件。

6、本发明实施例还提供一种基于应用运行时动态引入web组件的处理装置,用以在web应用运行时根据用户的不同需求和应用的不同状态动态地加载和渲染不同版本的webcomponent组件,该装置包括:

7、获取单元,用于在web应用运行时,获取用户对web component组件的需求和web应用的不同状态;

8、确定单元,用于根据用户对web component组件的需求和web应用的不同状态,从预先建立有web component组件库的服务器中,确定出当前web component组件对应的版本标识和组件脚本文件;所述web component组件库中预先存储有不同用户需求和web应用的不同状态对应的多个web component组件,以及每一组件对应的版本标识及组件脚本文件;

9、动态加载单元,用于根据预设组件版本策略,以及当前web component组件对应的版本标识,动态加载当前web component组件对应的组件脚本文件;所述组件版本策略为:根据预设加载组件函数的处理逻辑,动态引入组件版本及动态渲染对应组件版本的策略;

10、动态渲染单元,用于根据所述预设组件版本策略,在预设页面动态渲染展示当前web component组件。

11、本发明实施例还提供一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现上述基于应用运行时动态引入web组件的处理方法。

12、本发明实施例还提供一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现上述基于应用运行时动态引入web组件的处理方法。

13、本发明实施例还提供一种计算机程序产品,所述计算机程序产品包括计算机程序,所述计算机程序被处理器执行时实现上述基于应用运行时动态引入web组件的处理方法。

14、本发明实施例提供的基于应用运行时动态引入web组件的处理方案的有益技术效果是:与现有技术中组件是在构建阶段被打包进应用的技术方案相比,本发明实施例可以根据用户的实时需求和web应用的不同状态,在web应用运行时从预先建立有webcomponent组件库的服务器中动态加载和渲染不同版本的web component组件,使得开发web应用高效、灵活且稳定。



技术特征:

1.一种基于应用运行时动态引入web组件的处理方法,其特征在于,包括:

2.如权利要求1所述的方法,其特征在于,根据所述预设组件版本策略,在预设页面渲染展示当前web component组件,包括:

3.如权利要求1所述的方法,其特征在于,还包括:利用web component的隔离特征,为每个组件隔离样式和脚本。

4.如权利要求1所述的方法,其特征在于,web component组件的版本通过目录结构来处理,每一组件对应的组件脚本文件标识存放在包含版本标识的子目录中。

5.如权利要求1所述的方法,其特征在于,还包括:通过一个index.js文件,设置每个web component组件的默认版本,所述index.js文件根据需要更新,以指向组件的最新版本或用户指定版本。

6.如权利要求1所述的方法,其特征在于,根据预设组件版本策略,以及当前webcomponent组件对应的版本标识,动态加载当前web component组件对应的组件脚本文件,包括:根据预设组件版本策略,以及当前web component组件对应的版本标识,使用javascript的import()函数动态加载当前web component组件对应的组件脚本文件。

7.如权利要求1所述的方法,其特征在于,还包括:在动态加载当前web component组件对应的组件脚本文件的过程中,如果遇到网络错误、路径错误或版本不存在错误时,通过预设异常处理策略捕获并记录这些错误,以便进行故障排查。

8.如权利要求1所述的方法,其特征在于,还包括:在组件脚本文件的名称中加入版本标识作为后缀,以避免不同版本的组件在全局命名空间中发生冲突。

9.如权利要求1所述的方法,其特征在于,所述web component组件库的更新独立于使用组件的应用进行,以使得组件的新版本随时发布并立即可用。

10.如权利要求1所述的方法,其特征在于,所述web component组件库还预先存储有每一组件的版本类型;所述版本类型包括:默认版本类型和用户指定版本类型;

11.如权利要求1所述的方法,其特征在于,还包括按照如下方法对web component组件进行热更新处理:

12.一种基于应用运行时动态引入web组件的处理装置,其特征在于,包括:

13.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至11任一所述方法。

14.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现权利要求1至11任一所述方法。

15.一种计算机程序产品,其特征在于,所述计算机程序产品包括计算机程序,所述计算机程序被处理器执行时实现权利要求1至11任一所述方法。


技术总结
本发明公开了一种基于应用运行时动态引入Web组件的处理方法及装置,涉及代码开发技术领域,其中该方法包括:在Web应用运行时,获取用户需求和应用的不同状态;根据用户需求和应用状态,从预先建立有Web组件库的服务器中,确定出当前Web组件对应的版本标识和组件脚本文件;所述Web组件库中预先存储有不同用户需求和应用不同状态对应的多个Web组件,以及每一组件对应的版本标识及组件脚本文件;根据预设组件版本策略,以及当前组件对应的版本标识,动态加载当前组件对应的组件脚本文件,动态渲染展示Web组件。本发明可以在应用运行时根据用户的不同需求和应用的不同状态动态地加载和渲染不同版本的Web组件。

技术研发人员:刘辉,李卓,沈阳
受保护的技术使用者:中国建设银行股份有限公司
技术研发日:
技术公布日:2024/12/17
转载请注明原文地址:https://xbbs.6miu.com/read-25219.html