Hybridapp页面加载方法、装置和计算机设备与流程

本申请涉及到计算机领域，特别是涉及到一种hybridapp页面加载的方法、装置、计算机设备和存储介质。

背景技术：

人们已广泛使用移动终端的app来进行网络学习、网络社交、网上娱乐等内容。其中，hybridapp被大量使用。hybridapp(混合模式移动应用)是指介于web-app(网页应用)、native-app(原生应用)这两者之间的app。webview(网络视图)控件是hybrid框架下用来展示web页面的控件。目前基于hybridapp框架启动需要先加载网页，网页加载完成才能通过ajax(asynchronousjavascriptandxml)访问网络或者加载资源，这样顺序加载会导致页面长时间白屏，显示内容比较慢。从而用户需要等待页面加载，浪费不必要的时间。

技术实现要素：

本申请的主要目的为提供一种hybridapp页面加载的方法、装置、计算机设备和存储介质，旨在加快app页面展示速度，减少用户等待时间。

为了实现上述发明目的，本申请提出一种hybridapp页面加载的方法，包括以下步骤：

采用webview控件获取输入的url(统一资源定位符)地址；

截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；

在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全；

若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

进一步地，所述截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据的步骤，包括：

截获所述url地址；

获取预存的离线包中的预加载文件；

判断所述预加载文件中是否存在所述url地址；

若存在所述url地址，判断与所述url地址对应的ajax地址信息是否为空；

若与所述url地址对应的ajax地址信息不为空，则获取所述ajax地址，并根据所述ajax地址开始加载ajax数据。

进一步地，所述加载所述url地址对应的页面数据的步骤，包括：

判断是否存在所述url地址对应的本地页面文件的页面数据；

若存在所述url地址对应的本地页面文件，则加载所述本地页面文件；

若不存在所述url地址对应的本地页面文件，则从所述url地址对应的服务器中加载所述页面数据。

进一步地，所述判断是否存在所述url地址对应的本地页面文件的页面数据的步骤，包括：

从本地的局部存储器中查询所述url地址；

若所述查询结果不为0，判定存在所述本地页面文件；

若所述查询结果为0，判定不存在所述本地页面文件。

进一步地，所述在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全的步骤之后，包括：

若所述ajax数据加载不完全，判断是否已从所述ajax地址对应的服务器获取数据；

若未从所述ajax地址对应的服务器获取数据，则向所述ajax地址对应的服务器发送ajax数据加载请求。

进一步地，所述采用webview控件获取输入的url地址的步骤，包括：

接收url地址获取指令；

根据所述url地址获取指令，采用webview控件获取通过点击url地址链接得到的url地址、通过识别二维码得到的url地址或者通过识别条形码得到的url地址。

进一步地，所述采用webview控件获取输入的url地址的步骤之前，包括：

将所述webview控件的缓存模式设置为load_default模式，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件；

将cache-control字段设置为max-age＝a，其中a为所述url地址对应的页面最近两次更新的间隔时间。

本申请提供一种hybridapp页面加载的装置，所述装置应用于移动终端，包括：

url地址获取单元，用于采用webview控件获取输入的url地址；

ajax数据加载单元，用于截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；

ajax数据判断单元，用于在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全；

页面渲染单元，用于若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

本申请提供一种计算机设备，包括存储器和处理器，所述存储器存储有计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述方法的步骤。

本申请提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任一项所述的方法的步骤。

本申请的hybridapp页面加载的方法、装置、计算机设备和存储介质，通过将传统webview加载页面时串行加载url页面再加载ajax数据，改进为在webview加载页面时并行加载url页面与ajax数据，从而加快app页面显示速度，减少用户等待时间。

附图说明

图1为本申请一实施例的hybridapp页面加载的方法的流程示意图；

图2为本申请一实施例的hybridapp页面加载的装置的结构示意框图；

图3为本申请一实施例的计算机设备的结构示意框图。

本申请目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

为了使本申请的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本申请进行进一步详细说明。应当理解，此处描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。

参照图1，本申请实施例提供一种hybridapp页面加载的方法，包括以下步骤：

s1、采用webview控件获取输入的url地址；

s2、截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；

s3、在所述页面数据加载完全后，展示预留有所述ajax对应位置的页面，同时判断所述ajax数据是否加载完全；

s4、若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

如上述步骤s1所述，采用webview控件获取输入的url地址。其中，hybridapp(混合模式移动应用)是指介于web-app(网页应用)、native-app(原生应用)这两者之间的app。webview控件是hybrid框架下用来展示web页面的控件。统一资源定位符url是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示，是互联网上标准资源的地址。其中，所述采用webview控件获取输入的url地址的过程包括：采用webview控件对用户手动输入的url地址进行识别，从而获得url地址；或者采用webview控件对终端调用的url地址链接，从而输入的url地址进行识别，从而获得url地址。

如上述步骤s2所述，截获所述url地址，同时获取预存的离线包中的预加载文件(例如preload文件，存储有预先加载数据的文件)中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据。在离线包(指本地)的预加载文件中会存在所述url地址及与所述url地址对应的ajax地址。例如：“/views/page/explore/index.html”:“/ajax/boostore/index”。据此，在截获所述url地址时，就提前开始加载相应的ajax数据。其中ajax是“asynchronousjavascriptandxml”(异步javascript和xml)，是指一种创建交互式网页应用的网页开发技术。ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。其中加载的页面数据可以是本地的页面数据也可以是在线数据。进一步地，所述webview的缓存模式可以load_cache_else_network模式，从而将缓存策略设置为：无论是否有网络，只要本地有缓存，都使用缓存；本地没有缓存时才从网络上获取。

如上述步骤s3所述，在所述页面数据加载完全后，展示预留有所述ajax对应位置的页面，同时判断所述ajax数据是否加载完全。在加载完页面数据后，将进行页面渲染。但是完整的页面包括url地址对应的页面数据与ajax数据。因此在此还需判断所述ajax数据是否加载完全。

如上述步骤s4所述，若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。若所述ajax数据加载完全，由于显示页面所需数据齐备，据此可以拼接数据并渲染页面。此时由于ajax数据已提前加载，因此由的加载时间会大大减少。

在一个实施方式中，所述截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据的步骤s2，包括：

s201、截获所述url地址；

s202、获取预存的离线包中的预加载文件；

s203、判断所述预加载文件中是否存在所述url地址；

s204、若存在所述url地址，判断与所述url地址对应的ajax地址信息是否为空；

s205、若不为空，则获取所述ajax地址,并根据所述ajax地址开始加载ajax数据。

如上述步骤所述，实现了获取所述ajax地址。离线包中的预加载文件中预存有一些url地址及与url地址相应的ajax地址，若所述url地址存在于预加载文件中，那么通过预加载文件中查询url地址，即可得到相应的ajax地址信息，并开始加载ajax数据。现有技术中，webview控制是在加载完url页面后再发出ajax请求，本实施例通过预加载文件中的ajax地址，可实现提前加载ajax数据，将现有技术的串行流程变成了并行流程，从而加快了app页面显示速度。具体地，所述预加载文件中的url地址及与url地址相应的ajax地址例如为：

“/views/page/explore/index.html”:“/ajax/bookstore/index”,

“/views/page/explore/view_all.html”:“/ajax/bookstore/list”,

“/views/page/book/detail.html”:“/ajax/book/getbookdetailpageajax”。

在一个实施方式中，所述加载所述url地址对应的页面数据的步骤s2，包括：

s211、判断是否存在所述url地址对应的本地页面文件的页面数据；

s212、若存在，则加载所述本地页面文件；

s213、若不存在，则从所述url地址对应的服务器中加载所述页面数据。

如上述步骤所述，实现了加载所述url地址对应的页面数据。采用本地页面文件作为加载的页面相较于加载在线页面，会免去页面数据的传输过程，从而加快页面显示速度。当用户并非是第一次访问所述url地址时，本地会存储有url地址的本地页面文件，此时直接加载所述本地页面文件可加快页面显示速度；当用户是第一次访问所述url地址时，由于不存在url地址的本地页面文件，因此必须从所述url地址对应的服务器中加载所述页面数据。

在一个实施方式中，所述判断是否存在所述url地址对应的本地页面文件的页面数据的步骤s211，包括：

s2111、从本地的局部存储器中查询所述url地址；

s2112、若所述查询结果不为0，判定存在所述本地页面文件；

s2113、若所述查询结果为0，判定不存在所述本地页面文件。

如上述步骤所述，实现了判断是否存在所述url地址对应的本地页面文件的页面数据。本实施方式采用本地的局部存储器作为本地存储，以利用localstorage的优点：localstorage可以存储的数据容量大；localstorage属于永久性存储；localstorage目前移动端浏览器支持度良好。当查询结果不为0时，查询获得的即为所述url地址对应的本地页本文件。

在一个实施方式中，所述在所述页面数据加载完全后，展示预留有所述ajax对应位置的页面，同时判断所述ajax数据是否加载完全的步骤s3之后，包括：

s31、若所述ajax数据加载不完全，判断是否已从所述ajax地址对应的服务器获取数据；

s32、若未从所述ajax地址对应的服务器获取数据，则发送ajax数据加载请求。

如上述步骤所述，实现了对所述ajax数据是否完全的判断。如前所述，所述ajax数据是提前加载的，此时所述ajax数据应当加载完成。但是若存在特殊情况导致所述ajax数据并未加载完全或未开始加载，则app页面无法显示。所述特殊情况例如：发送的ajax请求被拦截而未到达ajax地址相应的服务器；ajax地址相应的服务器拒绝了ajax请求。因此判断所述ajax数据是否完全，若不完全，则发送ajax数据加载请求。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤s1，包括：

s101、接收url地址获取指令；

s102、根据所述url地址获取指令，采用webview控件获取通过点击url地址链接得到的url地址、通过识别二维码得到的url地址或者通过识别条形码得到的url地址。

如上述步骤所述，实现了采用webview控件获取输入的url地址。在app中，用户可以任意选用输入url地址的方式，包括：点击url地址链接、扫描二维码或者扫描条形码。据此，webview控件得以获取url地址。其中url地址获取指令通过触屏点击而发出。通过识别二维码得到的url地址或者通过识别条形码得到的url地址的获取过程包括：调取移动终端内置摄像头，采用所述摄像头扫描所述二维码或者条形码以获得url地址，采用webview控件获取获取所述url地址。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤s1之前，包括：

s01、将所述webview的缓存模式设置为load_default模式，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件；

s02、将cache-control字段设置为max-age＝a，其中a为所述url地址对应的页面最近两次更新的间隔时间。

如上述步骤所述，实现了设置缓存模式。其中，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件，cache-control为max-age＝a时，表示缓存的内容将在a秒后失效。本实施方式中将a秒设置为所述url地址对应的页面最近两次更新的间隔时间，从而在尽量获取更新页面的情况下，尽可能使用本地存储，从而加快页面显示速度。

本申请的hybridapp页面加载的方法，通过将传统webview加载页面时串行加载url页面再加载ajax数据，改进为在webview加载页面时并行加载url页面与ajax数据，从而加快app页面显示速度，减少用户等待时间。

参照图2，本申请实施例提供一种hybridapp页面加载的装置，包括：

url地址获取单元10，用于采用webview控件获取输入的url地址；

ajax数据加载单元20，用于截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；

ajax数据判断单元30，用于在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全；

页面渲染单元40，用于若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

如上述单元10所述，采用webview控件获取输入的url地址。其中，hybridapp(混合模式移动应用)是指介于web-app(网页应用)、native-app(原生应用)这两者之间的app。webview控件是hybrid框架下用来展示web页面的控件。统一资源定位符url是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示，是互联网上标准资源的地址。其中，所述采用webview控件获取输入的url地址的过程包括：采用webview控件对用户手动输入的url地址进行识别，从而获得url地址；或者采用webview控件对终端调用的url地址链接，从而输入的url地址进行识别，从而获得url地址。

如上述单元20所述，截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据。在离线包的预加载文件中会存在所述url地址及与所述url地址对应的ajax地址。例如：“/views/page/explore/index.html”:“/ajax/boostore/index”。据此，在截获所述url地址时，就提前开始加载相应的ajax数据。其中ajax是“asynchronousjavascriptandxml”(异步javascript和xml)，是指一种创建交互式网页应用的网页开发技术。ajax是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。其中加载的页面数据可以是本地的页面数据也可以是在线数据。进一步地，所述webview的缓存模式可以load_cache_else_network模式，从而将缓存策略设置为：无论是否有网络，只要本地有缓存，都使用缓存；本地没有缓存时才从网络上获取。

如上述单元30所述，在所述页面数据加载完全后，展示预留有所述ajax对应位置的页面，同时判断所述ajax数据是否加载完全。在加载完页面数据后，将进行页面渲染。但是完整的页面包括url地址对应的页面数据与ajax数据。因此在此还需判断所述ajax数据是否加载完全。

如上述单元40所述，若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。若所述ajax数据加载完全，由于显示页面所需数据齐备，据此可以拼接数据并渲染页面。此时由于ajax数据已提前加载，因此由的加载时间会大大减少。

在一个实施方式中，所述ajax数据加载单元20，包括：

url地址截获子单元，用于截获所述url地址；

预加载文件获取子单元，用于获取预存的离线包中的预加载文件；

url地址判断子单元，用于判断所述预加载文件中是否存在所述url地址；

ajax地址信息判断子单元，用于若存在所述url地址，判断与所述url地址对应的ajax地址信息是否为空；

ajax数据开始加载子单元，用于若不为空，则获取所述ajax地址，并根据所述ajax地址开始加载ajax数据。

如上所述，实现了获取所述ajax地址。离线包中的预加载文件中预存有一些url地址及与url地址相应的ajax地址，若所述url地址存在于预加载文件中，那么通过预加载文件中查询url地址，即可得到相应的ajax地址信息，并开始加载ajax数据。现有技术中，webview控件是在加载完url页面后再发出ajax请求，本实施例通过预加载文件中的ajax地址，可实现提前加载ajax数据，将现有技术的串行流程变成了并行流程，从而加快了app页面显示速度。具体地，所述预加载文件中的url地址及与url地址相应的ajax地址例如为：

“/views/page/explore/index.html”:“/ajax/bookstore/index”,

“/views/page/explore/view_all.html”:“/ajax/bookstore/list”,

“/views/page/book/detail.html”:“/ajax/book/getbookdetailpageajax”。

在一个实施方式中，所述ajax数据加载单元20，包括：

本地页面文件判断子单元，用于判断是否存在所述url地址对应的本地页面文件的页面数据；

本地页面文件加载子单元，用于若存在，则加载所述本地页面文件；

页面数据加载子单元，用于若不存在，则从所述url地址对应的服务器中加载所述页面数据。

如上所述，实现了加载所述url地址对应的页面数据。采用本地页面文件作为加载的页面相较于加载在线页面，会免去页面数据的传输过程，从而加快页面显示速度。当用户并非是第一次访问所述url地址时，本地会存储有url地址的本地页面文件，此时直接加载所述本地页面文件可加快页面显示速度；当用户是第一次访问所述url地址时，由于不存在url地址的本地页面文件，因此必须从所述url地址对应的服务器中加载所述页面数据。

在一个实施方式中，所述本地页面文件判断子单元，包括：

url地址查询模块，用于从本地的局部存储器中查询所述url地址；

本地页面文件判定存在模块，用于若所述查询结果不为0，判定存在所述本地页面文件；

本地页面文件判定不存在模块，用于若所述查询结果为0，判定不存在所述本地页面文件。

如上所述，实现了判断是否存在所述url地址对应的本地页面文件的页面数据。本实施方式采用本地的局部存储器作为本地存储，以利用localstorage的优点：localstorage可以存储的数据容量大；localstorage属于永久性存储；localstorage目前移动端浏览器支持度良好。当查询结果不为0时，查询获得的即为所述url地址对应的本地页本文件。

在一个实施方式中，所述装置，包括：

ajax地址获取数据判断单元，用于若所述ajax数据加载不完全，判断是否已从所述ajax地址对应的服务器获取数据；

ajax数据加载请求发送单元，用于若未从所述ajax地址对应的服务器获取数据，则发送ajax数据加载请求。

如上所述，实现了对所述ajax数据是否完全的判断。如前所述，所述ajax数据是提前加载的，此时所述ajax数据应当加载完成。但是若存在特殊情况导致所述ajax数据并未加载完全或未开始加载，则app页面无法显示。所述特殊情况例如：发送的ajax请求被拦截而未到达ajax地址相应的服务器；ajax地址相应的服务器拒绝了ajax请求。因此判断所述ajax数据是否完全，若不完全，则发送ajax数据加载请求。

在一个实施方式中，所述url地址获取单元10，包括：

url地址获取指令接收子单元，用于接收url地址获取指令；

url地址获取子单元，用于根据所述url地址获取指令，采用webview控件获取通过点击url地址链接得到的url地址、通过识别二维码得到的url地址或者通过识别条形码得到的url地址。

如上所述，实现了采用webview控件获取输入的url地址。在app中，用户可以任意选用输入url地址的方式，包括：点击url地址链接、扫描二维码或者扫描条形码。据此，webview控件得以获取url地址。其中url地址获取指令通过触屏点击而发出。通过识别二维码得到的url地址或者通过识别条形码得到的url地址的获取过程包括：调取移动终端内置摄像头，采用所述摄像头扫描所述二维码或者条形码以获得url地址，采用webview控件获取获取所述url地址。

在一个实施方式中，所述装置，包括：

缓存模式设置单元，用于将所述webview控件的缓存模式设置为load_default模式，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件；

字段设置单元，用于将cache-control字段设置为max-age＝a，其中a为所述url地址对应的页面最近两次更新的间隔时间。

如上所述，实现了设置缓存模式。其中，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件，cache-control为max-age＝a时，表示缓存的内容将在a秒后失效。本实施方式中将a秒设置为所述url地址对应的页面最近两次更新的间隔时间，从而在尽量获取更新页面的情况下，尽可能使用本地存储，从而加快页面显示速度。

本申请的hybridapp页面加载的装置，通过将传统webview加载页面时串行加载url页面再加载ajax数据，改进为在webview加载页面时并行加载url页面与ajax数据，从而加快app页面显示速度，减少用户等待时间。

参照图3，本发明实施例中还提供一种计算机设备，该计算机设备可以是服务器，其内部结构可以如图所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中，该计算机设计的处理器用于提供计算和控制能力。该计算机设备的存储器包括非易失性存储介质、内存储器。该非易失性存储介质存储有操作系统、计算机程序和数据库。该内存器为非易失性存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的数据库用于存储hybridapp页面加载的方法所用数据。该计算机设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序被处理器执行时以实现一种hybridapp页面加载的方法。

上述处理器执行上述hybridapp页面加载的方法，包括以下步骤：采用webview控件获取输入的url地址；截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全；若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

在一个实施方式中，所述截获所述url地址，同时获取离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据的步骤，包括：截获所述url地址；获取预存的离线包中的预加载文件；判断所述预加载文件中是否存在所述url地址；若存在所述url地址，判断与所述url地址对应的ajax地址信息是否为空；若与所述url地址对应的ajax地址信息不为空，则获取所述ajax地址，并根据所述ajax地址开始加载ajax数据。

在一个实施方式中，所述加载所述url地址对应的页面数据的步骤，包括：判断是否存在所述url地址对应的本地页面文件的页面数据；若存在所述url地址对应的本地页面文件，则加载所述本地页面文件；若不存在所述url地址对应的本地页面文件，则从所述url地址对应的服务器中加载所述页面数据。

在一个实施方式中，所述判断是否存在所述url地址对应的本地页面文件的页面数据的步骤，包括：从本地的局部存储器中查询所述url地址；若所述查询结果不为0，判定存在所述本地页面文件；若所述查询结果为0，判定不存在所述本地页面文件。

在一个实施方式中，所述在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全的步骤之后，包括：若所述ajax数据加载不完全，判断是否已从所述ajax地址对应的服务器获取数据；若未从所述ajax地址对应的服务器获取数据，则向所述ajax地址对应的服务器发送ajax数据加载请求。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤，包括：接收url地址获取指令；根据所述url地址获取指令，采用webview控件获取通过点击url地址链接得到的url地址、通过识别二维码得到的url地址或者通过识别条形码得到的url地址。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤之前，包括：将所述webview控件的缓存模式设置为load_default模式，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件；将cache-control字段设置为max-age＝a，其中a为所述url地址对应的页面最近两次更新的间隔时间。

本领域技术人员可以理解，图中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的计算机设备的限定。

本申请的计算机设备，通过将传统webview加载页面时串行加载url页面再加载ajax数据，改进为在webview加载页面时并行加载url页面与ajax数据，从而加快app页面显示速度，减少用户等待时间。

本申请一实施例还提供一种计算机可读存储介质，其上存储有计算机程序，计算机程序被处理器执行时实现hybridapp页面加载的方法，包括以下步骤：采用webview控件获取输入的url地址；截获所述url地址，同时获取预存的离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据，同时加载所述url地址对应的页面数据；在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全；若所述ajax数据加载完全，则拼接所述页面数据与所述ajax数据，并基于拼接后的数据采用webview控件渲染页面。

在一个实施方式中，所述截获所述url地址，同时获取离线包中的预加载文件中所述url地址对应的ajax地址，并根据所述ajax地址开始加载ajax数据的步骤，包括：截获所述url地址；获取预存的离线包中的预加载文件；判断所述预加载文件中是否存在所述url地址；若存在所述url地址，判断与所述url地址对应的ajax地址信息是否为空；若与所述url地址对应的ajax地址信息不为空，则获取所述ajax地址，并根据所述ajax地址开始加载ajax数据。

在一个实施方式中，所述加载所述url地址对应的页面数据的步骤，包括：判断是否存在所述url地址对应的本地页面文件的页面数据；若存在所述url地址对应的本地页面文件，则加载所述本地页面文件；若不存在所述url地址对应的本地页面文件，则从所述url地址对应的服务器中加载所述页面数据。

在一个实施方式中，所述判断是否存在所述url地址对应的本地页面文件的页面数据的步骤，包括：从本地的局部存储器中查询所述url地址；若所述查询结果不为0，判定存在所述本地页面文件；若所述查询结果为0，判定不存在所述本地页面文件。

在一个实施方式中，所述在所述页面数据加载完全后，展示预留有所述ajax数据对应位置的页面，同时判断所述ajax数据是否加载完全的步骤之后，包括：若所述ajax数据加载不完全，判断是否已从所述ajax地址对应的服务器获取数据；若未从所述ajax地址对应的服务器获取数据，则向所述ajax地址对应的服务器发送ajax数据加载请求。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤，包括：接收url地址获取指令；根据所述url地址获取指令，采用webview控件获取通过点击url地址链接得到的url地址、通过识别二维码得到的url地址或者通过识别条形码得到的url地址。

在一个实施方式中，所述采用webview控件获取输入的url地址的步骤之前，包括：将所述webview控件的缓存模式设置为load_default模式，所述load_default模式能够根据cache-control字段决定是否使用本地存储文件；将cache-control字段设置为max-age＝a，其中a为所述url地址对应的页面最近两次更新的间隔时间。

本申请的计算机可读存储介质，通过将传统webview加载页面时串行加载url页面再加载ajax数据，改进为在webview加载页面时并行加载url页面与ajax数据，从而加快app页面显示速度，减少用户等待时间。

本领域普通技术人员可以理解实现上述实施例方法中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来完成，所述的计算机程序可存储于一非易失性计算机可读取存储介质中，该计算机程序在执行时，可包括如上述各方法的实施例的流程。其中，本申请所提供的和实施例中所使用的对存储器、存储、数据库或其它介质的任何引用，均可包括非易失性和/或易失性存储器。非易失性存储器可以包括只读存储器(rom)、可编程rom(prom)、电可编程rom(eprom)、电可擦除可编程rom(eeprom)或闪存。易失性存储器可包括随机存取存储器(ram)或者外部高速缓冲存储器。作为说明而非局限，ram以多种形式可得，诸如静态ram(sram)、动态ram(dram)、同步dram(sdram)、双速据率sdram(ssrsdram)、增强型sdram(esdram)、同步链路(synchlink)dram(sldram)、存储器总线(rambus)直接ram(rdram)、直接存储器总线动态ram(drdram)、以及存储器总线动态ram(rdram)等。

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

以上所述仅为本申请的优选实施例，并非因此限制本申请的专利范围，凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本申请的专利保护范围内。