CN115470432A - 一种页面渲染方法、装置、电子设备及计算机可读介质 - Google Patents

Abstract

本申请公开了页面渲染方法、装置、电子设备及计算机可读介质，涉及计算机技术领域，该方法包括：接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；获取用户对页面标识对应的页面的页面操作数据；响应于检测到网络环境由第一网络环境切换至第二网络环境，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；基于离线页面资源数据和页面操作数据，渲染页面。可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

Description

一种页面渲染方法、装置、电子设备及计算机可读介质

技术领域

本申请涉及计算机技术领域，尤其涉及一种页面渲染方法、装置、电子设备及计算机可读介质。

背景技术

在当今移动互联网盛行的时代，网络的形态除了有线连接，还有2G/3G/4G/wifi等多种网络连接方式。根据网络连接的信号强度可以分为正常网络和弱网，其中，弱网则为信号强度差、网速慢的网络。用户在弱网环境下访问页面时，往往无反应、出现错误或者网页打开等待时间过长。

在实现本申请过程中，发明人发现现有技术中至少存在如下问题：

页面在弱网环境无法被访问。

发明内容

有鉴于此，本申请实施例提供一种页面渲染方法、装置、电子设备及计算机可读介质，能够解决现有的页面在弱网环境无法被访问的问题。

为实现上述目的，根据本申请实施例的一个方面，提供了一种页面渲染方法，包括：

接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；

获取用户对页面标识对应的页面的页面操作数据；

响应于检测到网络环境由第一网络环境切换至第二网络环境，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；

基于离线页面资源数据和页面操作数据，渲染页面。

可选地，在检测到网络环境由第一网络环境切换至第二网络环境之后，方法还包括：

响应于确定本地未存储有与页面标识对应的离线页面资源数据，调用预置离线页面资源数据；

基于预置离线页面资源数据和页面操作数据，渲染页面标识对应的页面。

可选地，在获取用户对页面标识对应的页面的页面操作数据之后，页面渲染方法还包括：

响应于网络环境对应第一网络环境，获取页面渲染请求对应的数据标识；

根据页面标识和数据标识，获取对应的在线页面资源数据；

基于在线页面资源数据和页面操作数据，渲染页面标识对应的页面。

可选地，在获取对应的在线页面资源数据之后，方法还包括：

存储在线页面资源数据和页面操作数据至本地。

可选地，在获取对应的在线页面资源数据之后，方法还包括：

在网络环境切换至第一网络环境时，以在线页面资源数据更新本地存储的与页面标识对应的页面资源数据。

可选地，第一网络环境为正常网络环境，第二网络环境为弱网环境。

可选地，获取用户对页面标识对应的页面的页面操作数据，包括：

捕捉用户对页面标识对应的页面的操作；

基于各操作，生成操作队列；

将操作队列确定为用户对页面标识对应的页面的页面操作数据。

可选地，在检测到网络环境由第一网络环境切换至第二网络环境之后，方法还包括：

根据操作队列生成离线任务队列，响应于检测到网络环境由第二网络环境切换至第一网络环境时，调用任务调度器以提交离线任务队列至网络任务；

执行网络任务。

另外，本申请还提供了一种页面渲染装置，包括：

接收单元，被配置成接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；

数据获取单元，被配置成获取用户对页面标识对应的页面的页面操作数据；

数据调用单元，被配置成响应于检测到网络环境由第一网络环境切换至第二网络环境，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；

页面渲染单元，被配置成基于离线页面资源数据和页面操作数据，渲染页面。

可选地，页面渲染单元进一步被配置成：

响应于确定本地未存储有与页面标识对应的离线页面资源数据，调用预置离线页面资源数据；

基于预置离线页面资源数据和页面操作数据，渲染页面标识对应的页面。

可选地，页面渲染单元进一步被配置成：

响应于网络环境对应第一网络环境，获取页面渲染请求对应的数据标识；

根据页面标识和数据标识，获取对应的在线页面资源数据；

基于在线页面资源数据和页面操作数据，渲染页面标识对应的页面。

可选地，页面渲染装置还包括存储单元，被配置成：

存储在线页面资源数据和页面操作数据至本地。

可选地，页面渲染装置还包括更新单元，被配置成：

在网络环境切换至第一网络环境时，以在线页面资源数据更新本地存储的与页面标识对应的页面资源数据。

可选地，第一网络环境为正常网络环境，第二网络环境为弱网环境。

可选地，数据获取单元进一步被配置成：

捕捉用户对页面标识对应的页面的操作；

基于各操作，生成操作队列；

将操作队列确定为用户对页面标识对应的页面的页面操作数据。

可选地，页面渲染装置还包括任务执行单元，被配置成：

根据操作队列生成离线任务队列，当检测到网络环境由第二网络环境切换至第一网络环境时，调用任务调度器以提交离线任务队列至网络任务；

执行网络任务。

另外，本申请还提供了一种页面渲染电子设备，包括：一个或多个处理器；存储装置，用于存储一个或多个程序，当一个或多个程序被一个或多个处理器执行，使得一个或多个处理器实现如上述的页面渲染方法。

另外，本申请还提供了一种计算机可读介质，其上存储有计算机程序，程序被处理器执行时实现如上述的页面渲染方法。

上述发明中的一个实施例具有如下优点或有益效果：本申请通过接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；获取用户对页面标识对应的页面的页面操作数据；响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；基于离线页面资源数据和页面操作数据，渲染页面。可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

上述的非惯用的可选方式所具有的进一步效果将在下文中结合具体实施方式加以说明。

附图说明

附图用于更好地理解本申请，不构成对本申请的不当限定。其中：

图1是根据本申请一个实施例所提供的页面渲染方法的主要流程的示意图；

图2是根据本申请一个实施例所提供的页面渲染方法的主要流程的示意图；

图3是根据本申请一个实施例所提供的弱网环境页面访问示意图；

图4是根据本申请一个实施例所提供的页面静态资源更新示意图；

图5是根据本申请一个实施例所提供的页面数据存储结构示意图；

图6是根据本申请一个实施例所提供的页面操作响应示意图；

图7是根据本申请一个实施例所提供的页面加载示意图；

图8是根据本申请实施例的页面渲染装置的主要单元的示意图；

图9是本申请实施例可以应用于其中的示例性***架构图；

图10是适于用来实现本申请实施例的终端设备或服务器的计算机***的结构示意图。

具体实施方式

以下结合附图对本申请的示范性实施例做出说明，其中包括本申请实施例的各种细节以助于理解，应当将它们认为仅仅是示范性的。因此，本领域普通技术人员应当认识到，可以对这里描述的实施例做出各种改变和修改，而不会背离本申请的范围和精神。同样，为了清楚和简明，以下的描述中省略了对公知功能和结构的描述。本申请技术方案中对数据的获取、存储、使用、处理等均符合国家法律法规的相关规定。

图1是根据本申请一个实施例所提供的页面渲染方法的主要流程的示意图，如图1所示，页面渲染方法包括：

步骤S101，接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境。

本实施例中，页面渲染方法的执行主体(例如，可以是服务器)可以通过有线连接或无线连接的方式，接收页面渲染请求。该页面渲染请求具体可以是基于用户对页面的操作进行实时渲染显示的请求。执行主体在接收到页面渲染请求后，可以获取该请求中携带的网络标识和页面标识。其中，网络标识可以是当前所连接的网络的名称，例如aabbcc，该网络的名称是自定义得到的，本申请实施例对当前所连接的网络的名称不做具体限定。页面标识可以是用户当前所访问的页面的网址，例如可以是www.aabbcc.com/s？ie＝utf-8&f，本申请实施例对页面标识的内容不做具体限定。页面标识用于定位所对应的页面，以获取用户对所对应的页面的操作数据。

执行主体还可以基于获取的网络标识确定对应的网络环境。其中，网络环境包括正常网络环境和弱网环境。正常网络环境即为用户可以流畅地访问各种网页的环境；弱网环境即为用户访问网页时会出现无反应、弹出错误信息、网页打开时间超出预设阈值的环境，也就是信号强度差、网速慢的网络环境。

步骤S102，获取用户对页面标识对应的页面的页面操作数据。

页面操作数据可以包含用户对页面标识对应的页面的点击、查询、滑动等操作对应的数据，即用户使用页面时的一些操作，比如点击页面的操作数据、滑动页面的操作数据、查询操作数据等。执行主体可以根据操作发生的时间先后获取用户对页面标识对应的页面的页面操作数据。获取的页面操作数据，例如可以是按照时间先后获取的用户对页面标识对应的页面的操作所组成的操作队列。

具体地，获取用户对页面标识对应的页面的页面操作数据，包括：捕捉用户对页面标识对应的页面的操作，例如用户先后对页面做出点击、查询、滑动等操作；基于各操作，生成操作队列(例如点击、查询、滑动)；将操作队列(例如点击、查询、滑动)确定为用户对页面标识对应的页面的页面操作数据。

具体地，在获取用户对页面标识对应的页面的页面操作数据之后，方法还包括：

响应于网络环境对应第一网络环境，获取页面渲染请求对应的数据标识；根据页面标识和数据标识，获取对应的在线页面资源数据；基于在线页面资源数据和页面操作数据，渲染页面标识对应的页面。

本申请实施例中，当执行主体检测到当前所处的网络环境为第一网络环境，也即正常网络环境，则执行主体可以获取页面渲染请求对应的数据标识，该数据标识可以为页面数据对应的数据名称，例如SHA1(JSPAI1)。数据标识由JSAPI名称经SHA1加密后生成。示例的，数据标识对应的页面数据可以为页面中的图片、价格、文字、折扣等数据。执行主体可以根据页面标识和数据标识获取对应的在线页面资源数据。其中，在线页面资源数据可以包括页面静态资源数据和在线页面数据。具体地，页面静态资源数据可以为页面的布局、样式、事件处理逻辑等更新频率较低的数据。在线页面数据指的是用户浏览页面时看到的图片，文字等，例如，商品详情页中的商品的图片、名称、价格、属性、详情展示等更新频率较高的数据。执行主体可以根据页面标识获取对应的页面静态资源数据，根据数据标识，获取对应的在线页面数据。然后，执行主体可以基于在线页面资源数据和页面操作数据，渲染页面标识对应的页面并展示渲染后的页面。

具体地，在获取对应的在线页面资源数据之后，方法还包括：存储在线页面资源数据和页面操作数据至本地。

图5为页面数据存储结构示意图。以H5页面的数据存储为例，如图5所示：H5页面数据通过Http请求JSAPI获取，对于一些用于展示性质，实时性不强的数据，由H5页面代码将从JSAPI接口获取的数据直接存储到本地存储LocalStorage或者存储到轻型数据库SQLlite，页面标识可以由URL经安全散列算法1(Secure Hash Algorithm 1，SHA1)加密后生成，数据标识可以由JSAPI接口的名称经SHA1加密后生成，例如使用SetDate(SHA1(URL),SHA1(JSAPI1),JSAPI1Data)方法，这样就完成了页面数据的存储。在网络良好的情况下(也就是在正常网络环境中)，用户每次访问H5页面，都需要更新一次页面数据存储。H5页面在弱网环境情况下，H5页面代码GetDate(SHA1(URL),SHA1(JSPAI1))会根据URL和JSAPI名称(例如SHA1(URL)和SHA1(JSPAI1))即可找到对应的页面数据(也就是图5中的SHA1(JSPAI1)下方的各个数据data)，进行页面渲染。

具体地，在获取对应的在线页面资源数据之后，方法还包括：

在网络环境切换至第一网络环境时，以在线页面资源数据更新本地存储的与页面标识对应的页面资源数据。

图4为页面静态资源更新示意图。本申请实施例中，Webview：App里一种加载展示H5页面的容器；SHA1：一种安全散列算法，对不同字符加密生成唯一的加密符；LocalStorage：一种web的数据存储方式；SQLlite：一种轻型数据库。

如图4所示，在静态资源更新之前进行静态资源存储。以H5页面静态资源存储并更新为例，静态资源存储：H5页面静态资源包含HTML文件、JS文件、CSS文件及页面中的图片。用户在访问H5页面时，可以调用自定义的webview功能将页面URL通过SHA1加密生成页面唯一标识ID，然后将H5页面静态资源存放到手机里的该页面唯一标识ID目录下。示例的，H5页面静态资源每24小时更新一次，静态资源存储24小时后，在网络良好的情况下(也就是在正常网络环境下)先强制更新页面静态资源，再访问页面，如果网络不好，则继续访问离线页面资源数据，下次网络良好时(也就是在正常网络环境时)再执行强制更新。

步骤S103，响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据。

具体地，第一网络环境为正常网络环境，第二网络环境为弱网环境。

当检测到网络环境由第一网络环境切换至第二网络环境时，也就是当执行主体检测到网络环境由正常网络环境切换至弱网环境时，执行主体可以检测本地是否存储有与页面标识对应的离线页面资源数据，若是则从本地调用该离线页面资源数据。其中，本地存储的离线页面资源数据包括上一次正常网络环境时所存储的最新的页面静态资源数据和页面数据，或者是上一次更新的最新的页面标识对应的页面的页面静态资源数据(页面静态资源数据可以为页面的布局、样式、事件处理逻辑等更新频率较低的数据)和页面数据(页面数据可以为页面中的图片、价格、文字、折扣等更新频率较高的数据)。

具体地，在检测到网络环境由第一网络环境切换至第二网络环境之后，方法还包括：根据操作队列生成离线任务队列，当检测到网络环境由第二网络环境切换至第一网络环境时，调用任务调度器以提交离线任务队列至网络任务；执行网络任务。

其中，网络任务指的是由服务器实际执行的任务，即在正常网络环境中由服务器执行的任务。在由第二网络环境切换至第一网络环境时，也就是由弱网环境切换至正常网络环境时，执行主体可以调用任务调度器提交离线任务队列至网络任务，由服务器执行网络任务以完成相对应的网页渲染，并向用户展示渲染后的页面。

步骤S104，基于离线页面资源数据和页面操作数据，渲染页面。

执行主体可以根据离线页面资源数据渲染页面标识对应的页面以得到基于本地存储数据的渲染页面，执行主体可以在基于本地存储数据的渲染页面上根据页面操作数据修改本地数据，以得到与用户操作结果相对应的渲染页面。

本实施例通过接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；获取用户对页面标识对应的页面的页面操作数据；当检测到网络环境由第一网络环境切换至第二网络环境时，响应于确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；基于离线页面资源数据和页面操作数据，渲染页面。可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

图2是根据本申请一个实施例所提供的页面渲染方法的主要流程示意图，如图2所示，页面渲染方法包括：

步骤S201，接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境。

步骤S202，获取用户对页面标识对应的页面的页面操作数据。

步骤S203，当检测到网络环境由第一网络环境切换至第二网络环境时，响应于确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据。

步骤S204，基于离线页面资源数据和页面操作数据，渲染页面。

图6为页面操作响应示意图。示例的，如图6所示，首先执行主体判断当前所处的环境是否为弱网环境，若否则执行正常访问线上H5页面，同时存储线上H5页面所有静态资源和页面数据，并将这些静态资源和页面数据存储为该H5页面的离线页面资源数据存储于本地；若是弱网环境，则在弱网环境下，获取用户对H5页面的操作，基于用户对H5页面(即获取的页面标识对应的页面)的操作对H5页面进行‘假操作’(即与用户对H5页面的操作一样的操作)，该‘假操作’即为不会实际和服务器产生呼叫的操作，用户以为是真实操作，因为‘假操作’可以修改本地数据，使用户感觉跟操作真实数据一样，不影响用户体验。执行主体获取的用户对H5页面的操作先放入任务调度器，任务调度器会判断当前网络环境，如果是弱网环境，在执行完‘假操作’后，将用户所有的页面操作数据都存储到本地队列中，待网络恢复后，即当前网络环境切换为正常网络环境后，再由调度器模拟用户真实操作，以渲染用户所访问的页面。图6中的OnClick1()、OnClick2()指的是弱网环境下用户对页面的操作事件，比如点击、滑动、查询等，用户对页面的操作都会以事件的方式被页面响应。本申请实施例可以实现在弱网环境与正常网络环境切换时以及切换前后用户无感知地访问页面，提升用户的页面访问体验。

步骤S205，响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地未存储有与页面标识对应的离线页面资源数据，调用预置离线页面资源数据。

步骤S206，基于预置离线页面资源数据和页面操作数据，渲染页面标识对应的页面。

如果是由第一网络环境切换至第二网络环境，也即由正常网络环境切换至弱网环境，执行主体不直接加载线上H5资源，而是检测本地是否有页面标识对应的页面的离线页面资源数据，如果有离线页面资源数据则直接加载这些离线页面资源数据以渲染页面，同时将用户对页面标识对应的页面的页面操作都存储到本地。如果没有离线页面资源数据，则加载预置的离线页面作为兜底，保证用户体验。其中，离线页面资源数据指的就是预先存储在本地的、或者是最新更新的页面静态资源数据和页面数据。具体地，页面静态资源数据可以为页面的布局、样式、事件处理逻辑等更新频率较低的数据。页面数据指的是用户浏览页面时看到的图片，文字等，例如，商品详情页中的商品的图片、名称、价格、属性、详情展示等更新频率较高的数据。离线页面资源数据具体可以包含页面的HTTML文件，CSS文件、JS文件、图片资源、页面数据等，会以资源包的方式放在App的本地数据库中。

预置离线页面指的是预置离线页面资源数据对应的页面，指的是在本地存放的H5页面，此页面的样式和展示数据和线上页面一致，只是在弱网环境下才访问此页面。

当执行主体确定在弱网环境下，并且本地没有存储页面标识对应的离线页面资源数据时，执行主体可以调用预置离线页面资源数据，以访问该预置离线页面资源数据对应的预置离线页面，基于用户的页面操作数据，渲染预置离线页面以将渲染的页面在弱网环境下展示给用户，从而可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

图3是根据本申请一个实施例所提供的页面渲染方法的应用场景示意图。本申请实施例的页面渲染方法，可以应用于用户在弱网环境下的页面访问场景。如图3所示，用户访问H5页面时，首先检测当前网络状态是否是弱网环境，如果不是在弱网环境下，即当前网络状态良好，为正常网络环境，则正常访问线上H5页面，同时存储线上页面的所有静态资源、页面数据和页面操作，将存储的线上页面的所有静态资源、页面数据和页面操作作为此H5页面的离线资源(在本申请实施例中即为离线页面资源数据)；如果是在弱网环境下，则不会直接去加载线上H5资源，而是检测本地是否有此页面的离线资源，如果有离线资源则直接加载这些离线资源渲染页面，同时将页面操作都存储到本地，如果没有离线资源(在本申请实施例中即为离线页面资源数据)，则加载预置离线页面作为兜底，保证用户体验。

图7为页面加载示意图。如图7所示，以H5页面加载为例：H5页面在首次访问时，执行主体将静态资源、在线数据存储到本地。当用户在弱网环境再次访问改H5页面时，执行主体可以调用静态资源加载器在本地加载静态资源，还可以调用数据加载器加载本地数据，以使用户在弱网环境下也可以正常加载H5页面。用户在操作页面时，如果网络良好则直接提交网络任务，如果是在弱网环境下，则创建离线任务，并在弱网环境通过任务调度器提交离线任务至离线任务队列，该离线任务也可以操作本地数据，使得用户在弱网环境也可正常操作页面。等到网络恢复，执行主体可以将离线任务队列中的各个离线任务提交到网络任务，让用户在弱网环境下的操作变成真操作，以防止突然进入弱网环境用户访问页面无反应，保证用户在弱网环境下还可以正常进行H5页面的访问，提升了用户体验。

本申请实施例改进了H5页面的缓存机制，缓存数据不再局限于页面的布局和样式，增加了存储页面数据和储存页面操作的能力，可保证用户在短时间弱网环境下不会出现页面无法访问的情况，提升了H5页面的访问体验。同时，本申请实施例的页面渲染方法还可以扩展到传媒类APP，例如短视频APP、新闻APP等，提升用户体验，在电梯等弱网环境也可以正常使用。

图8是根据本申请实施例的页面渲染装置的主要单元的示意图。如图8所示，页面渲染装置800包括接收单元801、数据获取单元802、数据调用单元803和页面渲染单元804。

接收单元801，被配置成接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；

数据获取单元802，被配置成获取用户对页面标识对应的页面的页面操作数据；

数据调用单元803，被配置成响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；

页面渲染单元804，被配置成基于离线页面资源数据和页面操作数据，渲染页面。

在一些实施例中，页面渲染单元804进一步被配置成：响应于确定本地未存储有与页面标识对应的离线页面资源数据，调用预置离线页面资源数据；基于预置离线页面资源数据和页面操作数据，渲染页面标识对应的页面。

在一些实施例中，页面渲染单元804进一步被配置成：响应于网络环境对应第一网络环境，获取页面渲染请求对应的数据标识；根据页面标识和数据标识，获取对应的在线页面资源数据；基于在线页面资源数据和页面操作数据，渲染页面标识对应的页面。

在一些实施例中，页面渲染装置还包括图8中未示出的存储单元，被配置成：存储在线页面资源数据和页面操作数据至本地。

在一些实施例中，页面渲染装置还包括图8中未示出的更新单元，被配置成：在网络环境切换至第一网络环境时，以在线页面资源数据更新本地存储的与页面标识对应的页面资源数据。

在一些实施例中，第一网络环境为正常网络环境，第二网络环境为弱网环境。

在一些实施例中，数据获取单元802进一步被配置成：捕捉用户对页面标识对应的页面的操作；基于各操作，生成操作队列；将操作队列确定为用户对页面标识对应的页面的页面操作数据。

在一些实施例中，页面渲染装置还包括图8中未示出的任务执行单元，被配置成：根据操作队列生成离线任务队列，当检测到网络环境由第二网络环境切换至第一网络环境时，调用任务调度器以提交离线任务队列至网络任务；执行网络任务。

需要说明的是，在本申请页面渲染方法和页面渲染装置在具体实施内容上具有相应关系，故重复内容不再说明。

图9示出了可以应用本申请实施例的页面渲染方法或页面渲染装置的示例性***架构900。

如图9所示，***架构900可以包括终端设备901、902、903，网络904和服务器905。网络904用以在终端设备901、902、903和服务器905之间提供通信链路的介质。网络904可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。

用户可以使用终端设备901、902、903通过网络904与服务器905交互，以接收或发送消息等。终端设备901、902、903上可以安装有各种通讯客户端应用，例如购物类应用、网页浏览器应用、搜索类应用、即时通信工具、邮箱客户端、社交平台软件等(仅为示例)。

终端设备901、902、903可以是具有页面渲染处理屏并且支持网页浏览的各种电子设备，包括但不限于智能手机、平板电脑、膝上型便携计算机和台式计算机等等。

服务器905可以是提供各种服务的服务器，例如对用户利用终端设备901、902、903所提交的页面渲染请求提供支持的后台管理服务器(仅为示例)。后台管理服务器可以接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；获取用户对页面标识对应的页面的页面操作数据；响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；基于离线页面资源数据和页面操作数据，渲染页面。可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

需要说明的是，本申请实施例所提供的页面渲染方法一般由服务器905执行，相应地，页面渲染装置一般设置于服务器905中。

应该理解，图9中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。

下面参考图10，其示出了适于用来实现本申请实施例的终端设备的计算机***1000的结构示意图。图10示出的终端设备仅仅是一个示例，不应对本申请实施例的功能和使用范围带来任何限制。

如图10所示，计算机***1000包括中央处理单元(CPU)1001，其可以根据存储在只读存储器(ROM)1002中的程序或者从存储部分1008加载到随机访问存储器(RAM)1003中的程序而执行各种适当的动作和处理。在RAM1003中，还存储有计算机***1000操作所需的各种程序和数据。CPU1001、ROM1002以及RAM1003通过总线1004彼此相连。输入/输出(I/O)接口1005也连接至总线1004。

以下部件连接至I/O接口1005：包括键盘、鼠标等的输入部分1006；包括诸如阴极射线管(CRT)、液晶征信授权查询处理器(LCD)等以及扬声器等的输出部分1007；包括硬盘等的存储部分1008；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分1009。通信部分1009经由诸如因特网的网络执行通信处理。驱动器1010也根据需要连接至I/O接口1005。可拆卸介质1011，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器1010上，以便于从其上读出的计算机程序根据需要被安装入存储部分1008。

特别地，根据本申请公开的实施例，上文参考流程图描述的过程可以被实现为计算机软件程序。例如，本申请公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分1009从网络上被下载和安装，和/或从可拆卸介质1011被安装。在该计算机程序被中央处理单元(CPU)1001执行时，执行本申请的***中限定的上述功能。

需要说明的是，本申请所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以包括但不限于电、磁、光、电磁、红外线、或半导体的***、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本申请中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行***、装置或者器件使用或者与其结合使用。而在本申请中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行***、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本申请各种实施例的***、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的***来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本申请实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现。所描述的单元也可以设置在处理器中，例如，可以描述为：一种处理器包括接收单元、数据获取单元、数据调用单元和页面渲染单元。其中，这些单元的名称在某种情况下并不构成对该单元本身的限定。

作为另一方面，本申请还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的设备中所包含的；也可以是单独存在，而未装配入该设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该设备执行时，使得该设备接收页面渲染请求，获取对应的网络标识和页面标识，基于网络标识确定对应的网络环境；获取用户对页面标识对应的页面的页面操作数据；响应于检测到网络环境由第一网络环境切换至第二网络环境时，确定本地存储有与页面标识对应的离线页面资源数据，从本地调用离线页面资源数据；基于离线页面资源数据和页面操作数据，渲染页面。

根据本申请实施例的技术方案，可保证用户在短时间弱网环境下不会出现页面无法访问的情况，改善弱网环境下网页访问无反应、出现错误的情况，有效减少打开网页的等待时间，提升了用户对页面的访问体验。

上述具体实施方式，并不构成对本申请保护范围的限制。本领域技术人员应该明白的是，取决于设计要求和其他因素，可以发生各种各样的修改、组合、子组合和替代。任何在本申请的精神和原则之内所作的修改、等同替换和改进等，均应包含在本申请保护范围之内。

Claims (12)

1.一种页面渲染方法，其特征在于，包括：

接收页面渲染请求，获取对应的网络标识和页面标识，基于所述网络标识确定对应的网络环境；

获取用户对所述页面标识对应的页面的页面操作数据；

响应于检测到所述网络环境由第一网络环境切换至第二网络环境，确定本地存储有与所述页面标识对应的离线页面资源数据，从本地调用所述离线页面资源数据；

基于所述离线页面资源数据和所述页面操作数据，渲染所述页面。

2.根据权利要求1所述的方法，其特征在于，在所述检测到所述网络环境由第一网络环境切换至第二网络环境之后，所述方法还包括：

响应于确定本地未存储有与所述页面标识对应的离线页面资源数据，调用预置离线页面资源数据；

基于所述预置离线页面资源数据和所述页面操作数据，渲染所述页面标识对应的页面。

3.根据权利要求1所述的方法，其特征在于，在所述获取用户对所述页面标识对应的页面的页面操作数据之后，所述方法还包括：

响应于所述网络环境对应第一网络环境，获取所述页面渲染请求对应的数据标识；

根据所述页面标识和所述数据标识，获取对应的在线页面资源数据；

基于所述在线页面资源数据和所述页面操作数据，渲染所述页面标识对应的页面。

4.根据权利要求3所述的方法，其特征在于，在所述获取对应的在线页面资源数据之后，所述方法还包括：

存储所述在线页面资源数据和所述页面操作数据至本地。

5.根据权利要求3所述的方法，其特征在于，在所述获取对应的在线页面资源数据之后，所述方法还包括：

在所述网络环境切换至第一网络环境时，以所述在线页面资源数据更新本地存储的与所述页面标识对应的页面资源数据。

6.根据权利要求1所述的方法，其特征在于，所述第一网络环境为正常网络环境，所述第二网络环境为弱网环境。

7.根据权利要求1所述的方法，其特征在于，所述获取用户对所述页面标识对应的页面的页面操作数据，包括：

捕捉用户对所述页面标识对应的页面的操作；

基于各所述操作，生成操作队列；

将所述操作队列确定为用户对所述页面标识对应的页面的页面操作数据。

8.根据权利要求7所述的方法，其特征在于，在所述检测到所述网络环境由第一网络环境切换至第二网络环境之后，所述方法还包括：

根据所述操作队列生成离线任务队列，当检测到所述网络环境由第二网络环境切换至第一网络环境时，调用任务调度器以提交所述离线任务队列至网络任务；

执行所述网络任务。

9.一种页面渲染装置，其特征在于，包括：

接收单元，被配置成接收页面渲染请求，获取对应的网络标识和页面标识，基于所述网络标识确定对应的网络环境；

数据获取单元，被配置成获取用户对所述页面标识对应的页面的页面操作数据；

数据调用单元，被配置成响应于检测到所述网络环境由第一网络环境切换至第二网络环境，确定本地存储有与所述页面标识对应的离线页面资源数据，从本地调用所述离线页面资源数据；

页面渲染单元，被配置成基于所述离线页面资源数据和所述页面操作数据，渲染所述页面。

10.根据权利要求9所述的装置，其特征在于，所述页面渲染单元进一步被配置成：

响应于确定本地未存储有与所述页面标识对应的离线页面资源数据，调用预置离线页面资源数据；

基于所述预置离线页面资源数据和所述页面操作数据，渲染所述页面标识对应的页面。

11.一种页面渲染电子设备，其特征在于，包括：

一个或多个处理器；

存储装置，用于存储一个或多个程序，

当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如权利要求1-8中任一所述的方法。

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

Images