页面显示方法、装置及存储介质制造方法及图纸

本发明专利技术提供了一种页面显示方法、装置及存储介质，方法包括：响应获取的用户操作指令创建原生端页面，并通过原生端接口向服务器发送请求指令；接收服务器响应请求指令，反馈的至少一个网页组件数据；在原生端页面中创建至少一个网页视图容器，并通过至少一个网页视图容器加载对应的网页组件数据；当至少一个网页视图容器将对应的网页组件数据加载完成后，通过和至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在原生端页面中显示。提高了页面的显示速率。率。率。

【技术实现步骤摘要】
页面显示方法、装置及存储介质


[0001]本专利技术实施例涉及软件工程
，尤其涉及一种页面显示方法、装置及存储介质。

技术介绍

[0002]随着互联网技术和第五代移动通信技术(5th Generation Mobile Commu nication Technology，5G)技术的不断发展，在移动设备上现在主流的软件开发技术有基于原生、以及跨平台的React Native和Flutter技术将软件页面全部改造为网页页面。但是改造过程中，对原有上游跳转、下游跳出、页面后台服务器、页面原有功能等影响非常大，同时性能下降明显。而且网页页面的技术距离原生性能仍有不少差距，特别是网页页面加载性能较慢，在软件中访问全网页页面进行加载时，会有明显的白屏或者加载效果过渡，导致页面显示速率较低。

技术实现思路

[0003]本专利技术实施例提供的一种页面显示方法、装置及存储介质，可以提高页面的显示速率。
[0004]本专利技术的技术方案是这样实现的：
[0005]本专利技术实施例提供了一种页面显示方法，包括：
[0006]响应获取的用户操作指令创建原生端页面，并通过原生端接口向服务器发送请求指令；
[0007]接收服务器响应所述请求指令，反馈的至少一个网页组件数据；
[0008]在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据；
[0009]当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示。
[0010]上述方案中，所述接收服务器响应所述请求指令，反馈的至少一个网页组件数据之后，所述方法还包括：
[0011]将针对所述至少一个网页组件数据处理得到的离线数据存储在本地；
[0012]响应获取的第三用户操作指令再次创建所述原生端页面，并在所述原生端页面中创建至少一个第二网页视图容器；
[0013]调用所述至少一个第二网页视图容器的接口向服务器发送访问请求；
[0014]对所述访问请求进行检测，得到检测结果；
[0015]在所述检测结果表征所述访问请求满足预定规则时，拦截所述访问请求，在本地提取出所述离线数据供所述至少一个第二网页视图容器进行加载，以在所述原生端页面中显示。
[0016]上述方案中，所述对所述访问请求进行检测，得到检测结果，包括：
[0017]对所述访问请求进行检测，若所述访问请求中携带有所述离线数据的地址信息，则得到所述访问请求满足所述预定规则的所述检测结果。
[0018]上述方案中，所述在所述原生端页面中创建至少一个网页视图容器，包括：
[0019]根据预定程序指令，给所述至少一个网页视图容器的分别设置定位信息和预定尺寸信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器。
[0020]上述方案中，所述根据预定程序指令，给所述至少一个网页视图容器的设置定位信息和预定尺寸信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器，包括：
[0021]根据预定程序指令，给所述至少一个网页视图容器的分别设置定位信息；
[0022]将所述至少一个网页视图容器的宽度分别设置成不大于所述原生端页面宽度的预定宽度信息，将所述至少一个网页视图容器的高度分别设置成预定高度信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器。
[0023]上述方案中，所述接收服务器响应所述请求指令，反馈的至少一个网页组件数据之后，所述在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据之前，所述方法还包括：
[0024]在所述至少一个网页组件数据中分别创建对应的调用函数，进而建立与所述至少一个网页组件数据的通信连接；所述调用函数对应有预设标识信息。
[0025]上述方案中，所述在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据之后，所述当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示之前，所述方法还包括：
[0026]监听获取所述至少一个网页组件数据中的至少一个组件高度信息；
[0027]通过所述至少一个组件高度信息分别更新对应的网页视图容器的预定高度信息。
[0028]上述方案中，所述当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示，包括：
[0029]当所述至少一个网页视图容器将对应的网页组件数据加载完成后，将至少一个预设标识信息记录到所述原生端页面；
[0030]实时在所述原生端页面获取所述第二操作指令，根据所述第二操作指令确定出所述至少一个网页视图容器对应的至少一个实时偏移量信息，并建立预设标识信息与对应的实时偏移量信息的映射信息；
[0031]将得到的至少一个映射信息和所述原生端页面的高度信息输送给渲染组件，通过所述渲染组件结合所述至少一个映射信息和所述原生端页面的高度信息，在所述至少一个网页组件数据中调取当前渲染组件数据，在对应的网页视图容器中进行渲染得到所述显示内容，以在所述原生端页面中显示。
[0032]上述方案中，所述通过所述渲染组件结合所述至少一个映射信息和所述原生端页
面的高度信息，在所述至少一个网页组件数据中调取当前渲染组件数据，在对应的网页视图容器中进行渲染得到所述显示内容，以在所述原生端页面中显示，包括：
[0033]通过所述渲染组件根据所述至少一个实时偏移量信息和所述原生端页面的高度信息，确定出当前渲染区域信息；
[0034]根据所述当前渲染区域信息和对应的当前预设标识信息，在所述至少一个网页组件数据中确定出所述当前渲染组件数据；
[0035]通过所述渲染组件根据所述当前渲染组件数据在对应的网页视图容器中渲染出所述显示内容，以在所述原生端页面中显示。
[0036]本专利技术实施例还提供了一种页面显示装置，包括：
[0037]响应发送单元，用于响应获取的用户操作指令创建原生端页面，并通过原生端接口向服务器发送请求指令；
[0038]接收单元，用于接收服务器响应所述请求指令，反馈的至少一个网页组件数据；
[0039]创建加载单元，用于在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据；
[0040]渲染显示单元，用于当所述至少一个网页视图容器将对应的网页组件本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面显示方法，其特征在于，包括：响应获取的用户操作指令创建原生端页面，并通过原生端接口向服务器发送请求指令；接收服务器响应所述请求指令，反馈的至少一个网页组件数据；在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据；当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示。2.根据权利要求1所述的页面显示方法，其特征在于，所述接收服务器响应所述请求指令，反馈的至少一个网页组件数据之后，所述方法还包括：将针对所述至少一个网页组件数据处理得到的离线数据存储在本地；响应获取的第三用户操作指令再次创建所述原生端页面，并在所述原生端页面中创建至少一个第二网页视图容器；调用所述至少一个第二网页视图容器的接口向服务器发送访问请求；对所述访问请求进行检测，得到检测结果；在所述检测结果表征所述访问请求满足预定规则时，拦截所述访问请求，在本地提取出所述离线数据供所述至少一个第二网页视图容器进行加载，以在所述原生端页面中显示。3.根据权利要求2所述的页面显示方法，其特征在于，所述对所述访问请求进行检测，得到检测结果，包括：对所述访问请求进行检测，若所述访问请求中携带有所述离线数据的地址信息，则得到所述访问请求满足所述预定规则的所述检测结果。4.根据权利要求1所述的页面显示方法，其特征在于，所述在所述原生端页面中创建至少一个网页视图容器，包括：根据预定程序指令，给所述至少一个网页视图容器的分别设置定位信息和预定尺寸信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器。5.根据权利要求4所述的页面显示方法，其特征在于，所述根据预定程序指令，给所述至少一个网页视图容器的设置定位信息和预定尺寸信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器，包括：根据预定程序指令，给所述至少一个网页视图容器的分别设置定位信息；将所述至少一个网页视图容器的宽度分别设置成不大于所述原生端页面宽度的预定宽度信息，将所述至少一个网页视图容器的高度分别设置成预定高度信息，进而在所述原生端页面中创建得到所述至少一个网页视图容器。6.根据权利要求1所述的页面显示方法，其特征在于，所述接收服务器响应所述请求指令，反馈的至少一个网页组件数据之后，所述在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据之前，所述方法还包括：在所述至少一个网页组件数据中分别创建对应的调用函数，进而建立与所述至少一个网页组件数据的通信连接；所述调用函数对应有预设标识信息。
7.根据权利要求6所述的页面显示方法，其特征在于，所述在所述原生端页面中创建至少一个网页视图容器，并通过所述至少一个网页视图容器加载对应的网页组件数据之后，所述当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示之前，所述方法还包括：监听获取所述至少一个网页组件数据中的至少一个组件高度信息；通过所述至少一个组件高度信息分别更新对应的网页视图容器的预定高度信息。8.根据权利要求7所述的页面显示方法，其特征在于，所述当所述至少一个网页视图容器将对应的网页组件数据加载完成后，通过和所述至少一个网页组件数据建立的通信连接，及实时获取的第二操作指令，将所述至少一个网页组件数据渲染在对应的网页视图容器中得到显示内容，以在所述原生端页面中显示，包括：当所述至少一个网页视图容器将对应的网页组件数据加载完成后，将至少一个预设标识信息记录到所述原生端页面；实时在所述原生端页面获取所述第二操作指令，根据所述第二操作指令确定出所述至少一个网页视图容器对应的至少一个实时偏移量信息，并建立预设标识信息与对应的实时偏移量信息的映射信息；将得到的至少一个映射信息和所述原生端页面的高度信息输送给渲染组件，通过所述渲染组件结合所述至少一个映射信息和所述原生端页面的高度信息，在所述至少一个网页组件数据中调取当前渲染组件数据，在对应的网页视图容器中进行渲染得到所述显示内容，以在所述原生端页面中显示。9.根据权利要求8所述的页面显示方法，其特征在于，所述通过所述渲染组件结合所述至少一个映射信息和所述原生端页面的高度信息，在所述至少一个网页组件数据中调取当前渲染组件数据，在对应的网页视图容器中进行渲染得到所述显示内容，以在所述原生端页面中显示，包括：通过所述渲染组件根据...

【专利技术属性】
技术研发人员：唐超，
申请(专利权)人：北京京东世纪贸易有限公司，
类型：发明
国别省市：