H5组件处理方法及系统、存储介质及电子设备

技术领域

本发明涉及互联网应用技术领域，特别涉及一种H5组件处理方法及系统、存储介质及电子设备。

背景技术

目前人们所应用的多数应用程序通常会结合H5技术来实现部分的功能，在应用程序中结合H5技术可以提高应用程序的开发效率。H5技术在应用程序中应用时，通常是在应用程序中嵌入H5页面来实现对应的功能。

在应用程序中嵌入H5页面时，需要对H5页面应用的H5组件进行配置，从而支持该H5页面在应用程序中的实现。H5页面中的组件迭代速度较快，需要经常对移动终端的应用程序的H5组件进行变更或更新，以便用户可以应用新开发的H5组件。目前新开发的H5组件需要经过部署、审核等多个步骤，才能对移动终端的应用程序的H5组件进行变更或更新，整个周期较长，新开发的H5组件无法快速的部署至移动终端的应用程序中。

发明内容

有鉴于此，本发明提供一种H5组件处理方法及系统、存储介质及电子设备，应用本发明可以缩短H5组件的审核周期，快速部署至移动终端，为用户提供对应的服务。

为实现上述目的，本发明提供如下技术方案：

一种H5组件处理方法，包括：

接收预设的交付平台发送的H5组件配置信息，所述H5组件配置信息为所述交付平台基于应用程序的H5组件交付数据生成的信息；

基于所述H5组件配置信息，对所述应用程序的H5组件的配置进行变更，并生成所述应用程序的组件变更通知；

将所述组件变更通知向搭载所述应用程序的客户终端发送；

接收所述客户终端响应于所述组件变更通知的查询指令；

向所述客户终端反馈与所述查询指令对应的组件变更数据，使得所述客户终端基于所述组件变更数据变更所述应用程序在本地的H5组件。

上述的方法，可选的，交付平台基于应用程序的H5组件交付数据生成H5组件配置信息的过程，包括：

交付平台接收所述应用程序的H5组件交付数据，发布与所述H5组件交付数据对应的H5服务；

在所述H5服务发布成功时，生成与所述H5服务对应的H5组件配置信息。

上述的方法，可选的，所述将所述组件变更通知向搭载所述应用程序的客户终端发送，包括：

确定搭载所述应用程序的客户终端；

调用预设的消息推送服务，将所述组件变更通知向所述客户终端推送。

上述的方法，可选的，所述向所述客户终端反馈与所述查询指令对应的组件变更数据，包括：

对所述查询指令进行解析，获取组件查询信息；

确定与所述组件查询信息对应的各个目标H5组件，并基于各个所述目标H5组件的配置信息，生成组件变更数据；

通过与所述客户终端进行通讯的接口，将所述组件变更数据向所述客户终端反馈。

一种H5组件处理系统，包括：

交付平台、服务端以及客户终端；

所述交付平台，用于接收应用程序的H5组件交付数据，发布与所述H5组件交付数据对应的H5服务，在所述H5服务发布成功时，生成与所述H5服务对应的H5组件配置信息；

所述服务端，用于接收所述交付平台发送的所述H5组件配置信息，并基于所述H5组件配置信息对所述应用程序的H5组件的配置进行变更，并生成所述应用程序的组件变更通知，并将所述组件变更通知向所述客户终端发送；

所述客户终端，用于接收所述组件变更通知，并响应于所述组件变更通知，向所述服务端发送查询指令，接收所述服务端基于所述查询指令反馈的组件变更数据，并基于所述组件变更数据变更所述应用程序在本地的H5组件。

上述的系统，可选的，还包括：

所述客户终端，用于接收H5页面访问指令，确定与所述H5页面访问指令对应的各个页面H5组件，调用各个所述页面H5组件对应的H5服务，生成H5页面，并将所述H5页面展示。

上述的系统，可选的，所述服务端执行将所述组件变更通知向所述客户终端发送的过程，包括：

确定搭载所述应用程序的客户终端；

调用预设的消息推送服务，将所述组件变更通知向所述客户终端推送。

上述的系统，可选的，所述服务端执行基于所述查询指令反馈的组件变更数据的过程，包括：

对所述查询指令进行解析，获取组件查询信息；

确定与所述组件查询信息对应的各个目标H5组件，并基于各个所述目标H5组件的配置信息，生成组件变更数据；

通过与所述客户终端进行通讯的接口，将所述组件变更数据向所述客户终端反馈。

一种存储介质，所述存储介质包括存储的指令，其中，在所述指令运行时控制所述存储介质所在的设备执行如上所述的H5组件处理方法。

一种电子设备，包括存储器，以及一个或者一个以上的指令，其中一个或者一个以上指令存储于存储器中，且经配置以由一个或者一个以上处理器执行如上所述的H5组件处理方法。

与现有技术相比，本发明具有以下优点：

本发明提供一种H5组件处理方法及系统、存储介质及电子设备，具体如：接收预设的交付平台发送的H5组件配置信息，H5组件配置信息为交付平台基于应用程序的H5组件交付数据生成的信息；基于H5组件配置信息，对应用程序的H5组件的配置进行变更，并生成应用程序的组件变更通知；将组件变更通知向搭载应用程序的客户终端发送；接收客户终端响应于组件变更通知的查询指令；向客户终端反馈与查询指令对应的组件变更数据，使得客户终端基于组件变更数据变更应用程序在本地的H5组件。本发明在接收到H5组件配置信息后，对应用程序的H5组件的配置进行变更，并向搭载应用程序的客户终端推送组件变更通知，以便客户终端发送查询指令，并基于与查询指令对应的组件变更数据变更应用程序在本地的H5组件，无需经过冗长的审核即可将开发完成的H5组件更新至客户终端，有效缩短H5组件的生效周期，使得H5组件可以快速的在客户终端投入应用。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据提供的附图获得其他的附图。

图1为本发明实施例提供的一种H5组件处理方法的方法流程图；

图2为本发明实施例提供的服务端向客户终端反馈与查询指令对应的组件变更数据的方法流程图；

图3为本发明实施例提供的一种H5组件处理系统的结构示意图；

图4为本发明实施例提供的一种H5组件生效流程图；

图5为本发明实施例提供的一种电子设备的结构示意图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

在本申请中，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

专业术语：

WebView：是指网页视图，可以内嵌在移动端，实现前端的混合式开发。

H5：是一种制作万维网页面的标准计算机语言，由HTML5简化而来的词汇。

API：Application Programming Interface。又称为应用编程接口，就是软件系统不同组成部分衔接的约定。

APP：应用程序，Application的缩写，一般指手机软件。

交付平台：是基于应用管理、配置管理、集中化管理、提高IT架构合理化利用率的综合平台，实现共享、简单、快捷、灵活的应用。

本发明可用于众多通用或专用的计算装置环境或配置中。例如：个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器装置、包括以上任何装置或设备的分布式计算环境等等。本发明实施例提供的方法可以应用在由计算装置组成的处理系统中，本发明的执行主体可以为该处理系统的服务端。

参照图1，为本发明实施例提供的一种H5组件处理方法的方法流程图，具体说明如下所述：

S101、接收预设的交付平台发送的H5组件配置信息，H5组件配置信息为交付平台基于应用程序的H5组件交付数据生成的信息。

H5组件处理系统的服务端接收交付平台发送的H5组件配置信息，H5组件配置信息包括但不限于需要变更H5组件的应用程序的程序信息，以及该应用程序进行变更的H5组件的组件信息，程序信息包括但不限于应用程序的身份信息，组件信息包括但不限于进行变更的每个H5组件的标识。

进一步的，交付平台基于应用程序的H5组件交付数据生成H5组件配置信息的过程，包括：交付平台接收应用程序的H5组件交付数据，发布与H5组件交付数据对应的H5服务；在H5服务发布成功时，生成与H5服务对应的H5组件配置信息。

需要说明的是，H5组件交付数据包括但不限于应用程序的身份信息、进行变更的各个H5组件的标识、变更内容等数据。交付平台在接收到应用程序的H5组件交付数据后，对H5组件交付数据进行解析，从而确定H5组件，优选的，此处的H5组件的个数至少为一个，并且为H5组件为新开发完成，需要投入使用的H5组件。在确定各个H5组件后，交付平台可以在发布系统发布与各个H5组件对应的H5服务；H5服务发布成功后，发布系统向交付平台反馈发布成功信息，交付平台在接收到发布成功信息后，生成与H5服务对应的H5组件配置信息，优选的，H5组件配置信息包括但不限于应用程序的身份标识以及需要变更的H5组件的标识和变更内容等数据，进一步的，可以将H5组件交付数据直接确定为H5组件配置信息；进一步的，发布成功信息用于表征H5服务在发布系统已经发布成功。

S102、基于H5组件配置信息，对应用程序的H5组件的配置进行变更，并生成应用程序的组件变更通知。

服务端在接收到H5组件配置信息后，对H5组件配置信息进行解析，进而确定需要进行组件更新的应用程序，以及该应用程序中需要进行变更的H5组件的信息。

服务端基于该应用程序的身份信息，在服务端的服务配置中心确定该应用程序的组件配置数据，并基于H5组件配置数据中需要变更的H5组件的信息，对该组件配置数据中与需要变更的H5组件对应的配置进行变更，并记录该H5组件的变更信息，变更信息可以为变更时间或是变更后的版本，由此更新该应用程序在服务端的H5组件配置。

进一步的，当服务端对应用程序的H5组件的配置变更完成后，生成该应用程序的组件变更通知。

S103、将组件变更通知向搭载应用程序的客户终端发送。

将组件变更通知向搭载应用程序的客户终端发送的过程，具体如：确定搭载应用程序的客户终端；调用预设的消息推送服务，将组件变更通知向所述客户终端推送。

需要说明的是，客户终端可以为手机、IPAD等智能移动终端；搭载该应用程序的客户终端至少为一个，本发明的客户终端可以为多个，也可以为一个，每个客户终端更新H5组件的过程均是相同的。

优选的，消息推送服务的相关配置设置在服务端中，例如调用频次、使用的接口等配置。

S104、接收客户终端响应于组件变更通知的查询指令。

客户终端的应用程序设置监听组件，当应用程序在客户终端处于运行状态下时，该应用程序的监听组件处于工作状态，该监听组件用于监听服务端是否发送组件变更通知，当监听到服务端发送组件变更通知时，客户终端调用服务端的API接口向服务端发送查询指令，该API接口可以为服务端与客户终端进行数据交互的接口，优选的，查询指令中包含应用程序的身份信息以及该应用程序的每个H5组件的组件更新信息，优选的，更新信息可以为H5组件最近的更新时间或是最近更新的版本号，查询指令用于查询该应用程序中需要进行变更的H5组件。

S105、向客户终端反馈与查询指令对应的组件变更数据，使得客户终端基于组件变更数据变更应用程序在本地的H5组件。

参照图2，为本发明实施例提供的服务端向客户终端反馈与查询指令对应的组件变更数据的方法流程图，具体说明如下所述：

S201、对查询指令进行解析，获取组件查询信息。

服务端在接收到查询指令后，对查询指令进行解析，获取组件查询信息，组件查询信息中包括但不限于客户终端需要查询的应用程序的身份信息和该应用程序在客户终端的各个H5组件的组件更新信息。

S202、确定与组件查询信息对应的各个目标H5组件，并基于各个目标H5组件的配置信息，生成组件变更数据。

服务端基于该程序身份标识确定客户终端需要查询的应用程序，并将该应用程序确定为目标应用程序。

服务端在服务配置中心确定该目标应用程序的每个H5组件的变更信息，基于各个变更信息和各个组件更新信息，在服务端的各个H5组件中确定目标H5组件；进一步的，目标H5组件至少为一个；目标H5组件可以是变更信息与组件更新信息不一致的H5组件，还可以是服务端中新增的H5组件，当变更信息在各个组件变更信息中不存在与其相匹配的组件更新信息时，可确定该变更信息为新增的H5组件的信息，并将变更信息所对应的H5组件确定为新增的H5组件。

服务端在确定各个待变更H5组件后，从服务配置中心提取每个待变更H5组件的配置数据以及组件标识组成组件变更数据，并将组件变更数据向客户端反馈。

S203、通过与客户终端进行通讯的接口，将组件变更数据向客户终端反馈。

优选的，与客户终端进行通讯的接口可以为API接口。

客户终端在接收到组件变更数据后，对组件变更数据进行解析，从而获取各个组件标识以及每个组件标识所对应的配置数据，对于每个组件标识，在本地中确定与该组件标识对应的H5组件，并基于该组件标识所对应的配置数据该H5组件在客户终端的本地配置，由此，最新的H5组件在客户终端投入使用，由此最新的H5组件可以为使用该客户终端的用户提供服务。

本发明实施例提供的方法中，接收预设的交付平台发送的H5组件配置信息，H5组件配置信息为交付平台基于应用程序的H5组件交付数据生成的信息；基于H5组件配置信息，对应用程序的H5组件的配置进行变更，并生成应用程序的组件变更通知；将组件变更通知向搭载应用程序的客户终端发送；接收客户终端响应于组件变更通知的查询指令；向客户终端反馈与查询指令对应的组件变更数据，使得客户终端基于组件变更数据变更应用程序在本地的H5组件。本发明在接收到H5组件配置信息后，对应用程序的H5组件的配置进行变更，并向搭载应用程序的客户终端推送组件变更通知，以便客户终端发送查询指令，并基于与查询指令对应的组件变更数据变更应用程序在本地的H5组件，无需经过冗长的审核即可将开发完成的H5组件更新至客户终端，有效缩短H5组件的生效周期，使得H5组件可以快速的在客户终端投入应用。

参照图3，为本发明实施例提供的一种H5组件处理系统的结构示意图，该系统用于支持图1所示的方法的具体实现。如图3所示，H5组件处理系统包括交付平台301、服务端302以及客户终端303，进一步的，客户终端的个数至少为一个。

交付平台301，用于接收应用程序的H5组件交付数据，发布与H5组件交付数据对应的H5服务，在H5服务发布成功时，生成与H5服务对应的H5组件配置信息。

需要说明的是，交付平台可以分为组件管理模块、组件配置模块以及一键发布管理模块，其中，组件管理模块用于管理应用程序的各个开发完成的H5组件。

进一步的，开发人员确定需要变更组件的应用程序，并在组件管理模块中与该应用程序对应的各个H5组件中选择需要变更的各个H5组件，进一步的，开发人员还可以使用交付平台中的组件配置模块对选择的各个H5组件进行配置，例如组件的显隐配置、推送配置等，进而生成H5组件交付数据。

需要说明的是，交付平台可以调用一键发布管理模块将H5服务在发布系统发布，进一步的，一键发布管理模块除了发布H5服务外，还有发布服务端等其他功能。

服务端302，用于接收交付平台发送的H5组件配置信息，并基于H5组件配置信息对应用程序的H5组件的配置进行变更，并生成应用程序的组件变更通知，并将组件变更通知向客户终端发送。

需要说明的是，服务端中设置了组件配置管理服务，组件配置管理服务可以提供更新配置、推送配置以及查询配置等功能。

客户终端303，用于接收组件变更通知，并响应于组件变更通知，向服务端发送查询指令，接收服务端基于查询指令反馈的组件变更数据，并基于组件变更数据变更应用程序在本地的H5组件。

需要说明的是，客户终端设置监听组件，在监听组件监听到服务端发送的组件变更通知后，响应于组件变更通知，生成查询指令，并向服务端发送查询指令，以便服务端基于查询指令生成组件变更数据，并接收服务端反馈的组件变更数据，然后基于组件变更数据变更应用程序在客户终端的本地的H5组件。

优选的，客户终端还具有查询组件配置、更新组件配置等功能。

进一步的，客户终端还用于接收H5页面访问指令，确定与H5页面访问指令对应的页面H5组件，调用与页面H5组件对应的H5服务生成H5页面，并将H5页面展示；H5页面访问指令为使用客户终端的用户操作客户终端的应用程序时生成的指令，该指令中包含用户要访问的H5页面所应用的每个H5组件的信息，基于每个H5组件的信息，客户终端在本地确定与该H5组件的信息对应的页面H5组件，并调用与各个页面H5组件对应的H5服务，从而使得该H5服务生成H5页面，客户终端将H5页面进行展示。

本发明实施例提供的H5组件处理系统中，交付平台，用于接收应用程序的H5组件交付数据，发布与H5组件交付数据对应的H5服务，在H5服务发布成功时，生成与H5服务对应的H5组件配置信息；服务端，用于接收交付平台发送的H5组件配置信息，并基于H5组件配置信息对应用程序的H5组件的配置进行变更，并生成应用程序的组件变更通知，并将组件变更通知向客户终端发送；客户终端，用于接收组件变更通知，并响应于组件变更通知，向服务端发送查询指令，接收服务端基于查询指令反馈的组件变更数据，并基于组件变更数据变更应用程序在本地的H5组件。应用本发明提供的系统，开发完成的H5组件无需经过冗长的审核周期即可部署至客户终端，由此可以为客户终端提供服务，缩短H5组件从开发完成到为客户终端提供服务的周期，使得H5组件可以快速生效。

参照图4，为本发明实施例提供的一种H5组件生效流程图，图中的交付平台、服务端以及客户端组成本发明提供的组件处理系统，进一步的，图中的H5服务指组件处理系统中的交付平台发布的H5服务，H5服务为H5的web服务。

图4的流程说明如下所述：

1)实施或运营人员通过交付平台的统一配置中心，配置应用程序的App组件，此处的APP组件可以理解为上文中的H5组件；交付平台的统一配置中心可以由上文的组件管理模块和组件配置模块组成；

2)通过交付平台的一键发布H5服务，将H5服务上线，H5服务的发布系统返回发布结果；需要说明的是，此处的一键发布H5服务可以设置在上文所述的一键发布管理模块中；

3)根据H5服务的成功发布结果，将组件配置下发到服务端；此处的组件配置为上文所述的组件配置信息；

4)服务端接收组件配置，并更新服务端的H5组件的配置；

5)服务端下发组件变更通知，通知App组件配置变更到客户端，客户端持续监听组件配置是否变更；此处的客户端为上文的客户终端；

6)客户端监听到组件配置变更后，请求服务端API接口，并向服务端发送查询指令，以查询需要变更的组件的配置数据，服务端向客户端反馈组件配置，此处的组件配置为上文的组件变更数据；

7)客户端更新组件配置，将配置持久化到本地；

8)通过客户端访问H5服务，客户端得到H5服务响应结果后，用户即可使用新功能。

通过应用本发明提供的方法，可以在交付平台选择H5组件，打包部署相应的H5组件资源，同时把相应的组件显隐配置下发给服务端，客户端实时请求服务端组件显隐配置信息，达到App无需开发和发布应用市场就即时生效相应组件的能力，解决了App发布需要应用市场审核，项目交付周期长和新功能不能及时触达所有用户的问题，并且客户端用户无需下载安装包，即可使用新开发的H5组件的新功能。

随着应用程序的普遍应用，医院也开始使用应用程序，该种类型的应用程序可以称为互联网医院产品，互联网医院产品对接的医院较多，交付周期比较长，智慧医疗团队为了提高研发效率、节约时间和成本，鉴于移动App混合开发研发效率高及跨平台(H5相同的代码可同时用于Android和IOS平台)的特性，将互联网医院患者端App和医生端App部分功能模块在移动App提供访问入口，使用原生嵌入H5页面的方式实现，例如患者端的预约挂号、极速问诊等功能。

目前互联网医院产品的交付流程主要如下：

1)运营人员采集院方需求，同步给产研部门；

2)产品经理提取需求，整理需求文档，其中需求包括PC端和移动APP端等，其中，PC端如医生工作站、运营端等；移动APP端如医生端、患者端等；

3)产品经理与研发人员沟通需求及技术方案；

4)研发人员开发需求，并自测；

5)测试人员进行系统测试，测试完成后，产品经理及运营人员验收需求；

6)验收通过后，进行项目发布和APP审核。

其中，涉及APP研发并完成上线的技术方案如下：

1)移动App的原生代码使用WebView插件为H5提供容器，研发人员将H5实现的业务和界面作为系统组件；

2)Native端与Web端约定通信协议，Native App开发人员开发完成WebView布局和H5开发人员完成Web页面开发后，Native App为实现数据通信，通过WebView给window对象添加桥接器对象，供两端数据进行双向通信；

3)开发和测试完成后，Native端与H5 Web服务需要部署和发布，才能将完整的App上架到应用市场进行审核，审核通过后，用户可以下载更新。

Native端需要开发WebView布局，才能嵌入H5页面，开发完成后，App需要发布到应用市场进行审核，审核通过后，用户更新App才可以使用新功能。所以有如下缺点：

1)H5组件的选择，Native端仍需开发页面的显示/隐藏入口；

2)App发布需要应用市场审核，从而拉长项目交付周期；

3)用户更新App过程漫长，新功能不能及时触达所有用户。

由于以上缺点，导致院方和用户不能尽快使用新功能。

对于互联网医院交付周期长的问题，通过应用本发明提供的方案，在交付平台选择H5组件，打包部署相应的H5组件资源，同时把相应的组件显隐配置下发给服务端，客户端实时请求服务端组件显隐配置信息，达到App无需开发和发布应用市场就即时生效相应组件的能力，由此解决了App发布需要应用市场审核，项目交付周期长和新功能不能及时触达所有用户的问题，使得H5组件可以快速的生效，可以快速的为用户提供服务。

本发明实施例还提供了一种存储介质，所述存储介质包括存储的指令，其中，在所述指令运行时控制所述存储介质所在的设备执行上述H5组件处理方法。

本发明实施例还提供了一种电子设备，其结构示意图如图5所示，具体包括存储器601，以及一个或者一个以上的指令602，其中一个或者一个以上指令602存储于存储器601中，且经配置以由一个或者一个以上处理器603执行所述一个或者一个以上指令602执行上述H5组件处理方法。

上述各个实施例的具体实施过程及其衍生方式，均在本发明的保护范围之内。

本说明书中的各个实施例均采用递进的方式描述，各个实施例之间相同相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于系统或系统实施例而言，由于其基本相似于方法实施例，所以描述得比较简单，相关之处参见方法实施例的部分说明即可。以上所描述的系统及系统实施例仅仅是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本实施例方案的目的。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。

专业人员还可以进一步意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本发明的范围。

对所公开的实施例的上述说明，使本领域专业技术人员能够实现或使用本发明。对这些实施例的多种修改对本领域的专业技术人员来说将是显而易见的，本文中所定义的一般原理可以在不脱离本发明的精神或范围的情况下，在其它实施例中实现。因此，本发明将不会被限制于本文所示的这些实施例，而是要符合与本文所公开的原理和新颖特点相一致的最宽的范围。