CN104657118A - Native+Web混合移动应用的实现方法及装置 - Google Patents

Abstract

本发明提出Native+Web混合移动应用的实现方法及装置。方法包括：移动终端维护页面映射表，该映射表至少包括：Web页面的远程地址和本地地址；当移动终端上的一个应用需要访问一远程Web页面时，移动终端在所述页面映射表中查找该页面的远程地址，若查找到，直接根据映射表中该页面的本地地址查找到该Web页面，加载该Web页面；否则，向Web服务器获取并加载该Web页面，并将该Web页面存储到本地，同时在页面映射表中添加该Web页面的远程地址和本地地址。本发明提高了Native+Web混合移动应用的界面载入速度。

Description

Native+Web混合移动应用的实现方法及装置

技术领域

本发明涉及移动应用技术领域，尤其涉及Native+Web混合移动应用的实现方法及装置。

背景技术

移动应用存在三种形态：Native（原生）应用、Web应用、混合应用。所谓的Native应用指的是用平台特定的开发语言所开发的应用；Web应用主要是采用统一标准的HTML（Hyper Text Mark-up Language，超文本标记语言）、JavaScript（Java脚本）、CSS（Cascading Style Sheet，层叠样式）等网页程序语言开发的应用，可以通过终端浏览器访问该类应用，且该类应用可以跨平台；混合应用是指融合Native应用和Web应用的应用。图1分别给出了现有的Native应用、Web应用、混合应用的界面示意图。

Native应用能提供高质量的性能和用户体验，但是需要针对不同平台进行开发，开发成本高，频繁版本升级麻烦；Web应用开发技术门槛低，基于浏览器可以跨平台，开发成本低，版本升级只需要服务器后台更新页面可以做到用户无感知升级，但是每个页面需要从远程服务器后台拉取，用户体验不是很好；混合应用（这里指的是Web主体型，后续都默认为Web主体型）正是取Native应用和Web应用各自所长，这种类型应用仅使用原生系统程序语言实现一个具备网页浏览功能的UI（User Interface，用户界面）容器，所有用户可见的内容均为使用HTML、JavaScript、CSS等网页语言开发的Web页面，从而做到较低开发成本、无感知升级。

目前，混合应用（Web主体型）存在两类框架：

一、Web页面置于远程服务器

页面内容每次都需要从服务器侧拉取，应用界面加载速度慢，用户等待时间长，体验差；但是应用展示内容升级方便，只需要服务器侧更新Web页面，可以做到用户无感知。

二、Web页面打包在Native应用中

页面内容打包在本地应用中，仅数据从服务器侧获取，应用界面加载速度快；但是如果需要更新应用页面内容，则需要将新的Web页面重新打包到Native应用内，用户升级麻烦。

可见，现有的混合应用的技术方案，要么在应用界面加载速度上不尽人意，要么在应用内容升级方面不方便，无法满足用户多方面高质量体验要求。

发明内容

本发明提供Native+Web混合移动应用的实现方法及装置，以提高Native+Web混合移动应用的界面载入速度。

本发明的技术方案是这样实现的：

一种Native+Web混合移动应用的实现方法，该方法包括：

移动终端维护页面映射表，该映射表至少包括：Web页面的远程地址和本地地址；

当移动终端上的一个应用需要访问一远程Web页面时，移动终端在所述页面映射表中查找该页面的远程地址，若查找到，直接根据映射表中该页面的本地地址查找到该Web页面，加载该Web页面；否则，向Web服务器获取并加载该Web页面，并将该Web页面存储到本地，同时在页面映射表中添加该Web页面的远程地址和本地地址。

所述直接根据映射表中该页面的本地地址查找到该Web页面的同时进一步包括：

向Web服务器查询该Web页面的最新版本，若该最新版本高于本地存储的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新本地存储的老版本的Web页面。

所述页面映射表中进一步包括：Web页面的版本信息；

所述若该最新版本高于本地存储的该Web页面的版本为：

若该最新版本高于页面映射表指示的该Web页面的版本；

且，所述以下载的Web页面更新本地存储的老版本的Web页面的同时进一步包括：

以该最新版本信息更新页面映射表中该Web页面的版本信息。

一种Native+Web混合移动应用的实现装置，该装置包括：

页面映射表存储模块：存储页面映射表，该映射表至少包括Web页面的远程地址和本地地址；

Web页面存储模块：存储Web页面；

Web页面访问处理模块：当一个移动应用需要访问一远程Web页面时，在所述页面映射表中查找该页面的远程地址，若查找到，将映射表中该页面的本地地址发送给Native UI容器；否则，向Web服务器获取该Web页面，并将该Web页面存储到Web页面存储模块，同时在页面映射表中添加该Web页面的远程地址和本地地址，将该Web页面的本地地址发送给Native UI容器；

Native UI容器：接收Web页面访问处理模块发来的Web页面的本地地址，根据该本地地址在Web页面存储模块中查找到对应的Web页面，加载该页面。

所述Web页面访问处理模块进一步用于，当将映射表中该页面的本地地址发送给Native UI容器的同时，向Web服务器查询该Web页面的最新版本，若该最新版本高于Web页面存储模块存储的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新Web页面存储模块存储的老版本的Web页面。

所述页面映射表中进一步包括：Web页面的版本信息；

所述Web页面访问处理模块在以下载的Web页面更新Web页面存储模块存储的老版本的Web页面的同时，进一步以该最新版本信息更新页面映射表中该Web页面的版本信息。

所述装置位于移动终端中。

可见，本发明中，只在移动应用第一次访问远程Web页面时，需要从Web服务器下载该Web页面，此后，直接从本地载入该Web页面即可，提高了Native+Web混合移动应用的界面载入速度；

同时，本发明实施例中，在移动应用发起远程Web页面访问请求时，若可从本地载入该Web页面，则同时向Web服务器查询是否有更新版本，若有，则下载该新版本的Web页面并存储到本地，这样移动应用下一次就可访问到该新版本的Web页面，从而做到了用户对Web页面升级无感知。

附图说明

图1为现有的Native应用、Web应用、混合应用的界面示意图；

图2为本发明实施例提供的Native+Web混合移动应用的实现方法流程图；

图3为本发明实施例提供的Native+Web混合移动应用的实现装置的组成示意图。

具体实施方式

下面结合附图及具体实施例对本发明再作进一步详细的说明。

图2为本发明实施例提供的Native+Web混合移动应用的实现方法流程图，如图2所示，其具体步骤如下：

步骤201：当移动终端上的一个应用需要访问一远程Web页面时，移动终端在本地维护的页面映射表中查找该页面的远程地址。

远程地址即URL（Uniform Resource Locator，统一资源定位符）地址。

页面映射表中维护的是Web页面的远程地址、本地地址、版本信息等之间的映射关系。表1给出了页面映射表的一个示例：

表1页面映射表的一个示例

步骤202：移动终端判断是否查找到，若是，执行步骤204；否则，执行步骤203。

步骤203：移动终端向Web服务器获取该远程Web页面，获取到后，将该Web页面存储到本地维护的页面存储模块，在页面映射表中记录该Web页面的远程地址、本地地址、版本信息等之间的映射关系；同时，将该Web页面的本地地址发送给原生UI容器，原生UI容器根据该本地地址从页面存储模块中加载该Web页面，本流程结束。

在实际应用中，移动终端从Web服务器获取到Web页面的同时，若该Web页面还引用了资源，则还会同时获取到该Web页面引用的资源，此时，将Web页面及其引用的资源一并存储到页面存储模块，同时在页面映射表中记录的Web页面的远程地址、本地地址实质上是Web页面及其引用的资源的远程地址、本地地址。

步骤204：移动终端将该Web页面的本地地址通知原生UI容器，原生UI容器根据该本地地址从页面存储模块中加载该Web页面；同时，移动终端向Web服务器查询该Web页面的最新版本，若发现该最新版本高于页面映射表中指示的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新页面存储模块存储的老版本的Web页面，同时，更新页面映射表中该Web页面的版本信息。

图3为本发明实施例提供的Native+Web混合移动应用的实现装置的组成示意图，如图3所示，其主要包括：页面映射表存储模块31、Web页面存储模块32、Web页面访问处理模块33和Native UI容器34，其中：

页面映射表存储模块31：存储页面映射表，该映射表至少包括Web页面的远程地址和本地地址。

Web页面存储模块32：存储Web页面。

Web页面访问处理模块33：当一个移动应用需要访问一远程Web页面时，在页面映射表存储模块31存储的页面映射表中查找该页面的远程地址，若查找到，将映射表中该页面的本地地址发送给Native UI容器34；否则，向Web服务器获取该Web页面，并将该Web页面存储到Web页面存储模块32，同时在页面映射表存储模块31存储的页面映射表中添加该Web页面的远程地址和本地地址，将该Web页面的本地地址发送给Native UI容器34。

Native UI容器34：接收Web页面访问处理模块33发来的Web页面的本地地址，根据该本地地址在Web页面存储模块32中查找到对应的Web页面，加载该页面。

其中，Web页面访问处理模块33进一步用于，当将映射表中该页面的本地地址发送给Native UI容器34的同时，向Web服务器查询该Web页面的最新版本，若该最新版本高于Web页面存储模块32存储的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新Web页面存储模块32存储的老版本的Web页面。

其中，页面映射表存储模块31存储的页面映射表中还可进一步包括：Web页面的版本信息；

且，Web页面访问处理模块33在以下载的Web页面更新Web页面存储模块32存储的老版本的Web页面的同时，进一步以该最新版本信息更新页面映射表存储模块31存储的页面映射表中该Web页面的版本信息。

图3所示装置位于移动终端中。

以上所述仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明保护的范围之内。

Claims (7)

1.一种Native+Web混合移动应用的实现方法，其特征在于，该方法包括：

移动终端维护页面映射表，该映射表至少包括：Web页面的远程地址和本地地址；

当移动终端上的一个应用需要访问一远程Web页面时，移动终端在所述页面映射表中查找该页面的远程地址，若查找到，直接根据映射表中该页面的本地地址查找到该Web页面，加载该Web页面；否则，向Web服务器获取并加载该Web页面，并将该Web页面存储到本地，同时在页面映射表中添加该Web页面的远程地址和本地地址。

2.根据权利要求1所述的方法，其特征在于，所述直接根据映射表中该页面的本地地址查找到该Web页面的同时进一步包括：

向Web服务器查询该Web页面的最新版本，若该最新版本高于本地存储的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新本地存储的老版本的Web页面。

3.根据权利要求2所述的方法，其特征在于，所述页面映射表中进一步包括：Web页面的版本信息；

所述若该最新版本高于本地存储的该Web页面的版本为：

若该最新版本高于页面映射表指示的该Web页面的版本；

且，所述以下载的Web页面更新本地存储的老版本的Web页面的同时进一步包括：

以该最新版本信息更新页面映射表中该Web页面的版本信息。

4.一种Native+Web混合移动应用的实现装置，其特征在于，该装置包括：

页面映射表存储模块：存储页面映射表，该映射表至少包括Web页面的远程地址和本地地址；

Web页面存储模块：存储Web页面；

Web页面访问处理模块：当一个移动应用需要访问一远程Web页面时，在所述页面映射表中查找该页面的远程地址，若查找到，将映射表中该页面的本地地址发送给Native UI容器；否则，向Web服务器获取该Web页面，并将该Web页面存储到Web页面存储模块，同时在页面映射表中添加该Web页面的远程地址和本地地址，将该Web页面的本地地址发送给NativeUI容器；

Native UI容器：接收Web页面访问处理模块发来的Web页面的本地地址，根据该本地地址在Web页面存储模块中查找到对应的Web页面，加载该页面。

5.根据权利要求4所述的装置，其特征在于，所述Web页面访问处理模块进一步用于，当将映射表中该页面的本地地址发送给Native UI容器的同时，向Web服务器查询该Web页面的最新版本，若该最新版本高于Web页面存储模块存储的该Web页面的版本，则从Web服务器下载该最新版本的Web页面，以下载的Web页面更新Web页面存储模块存储的老版本的Web页面。

6.根据权利要求5所述的装置，其特征在于，所述页面映射表中进一步包括：Web页面的版本信息；

所述Web页面访问处理模块在以下载的Web页面更新Web页面存储模块存储的老版本的Web页面的同时，进一步以该最新版本信息更新页面映射表中该Web页面的版本信息。

7.根据权利要求4～6任一所述的装置，其特征在于，所述装置位于移动终端中。