[发明专利]在移动终端的浏览器内加载Web页面的方法及系统

说明书

本发明公开了一种在移动终端的浏览器内加载Web页面的方法及系统，所述方法包括以下步骤：将构成目标Web页面的不同元素封装进多个组件中，并将所述组件存储于Web服务器；从所述Web服务器获取预设的组件，并加载包括所述预设的组件的初始Web页面；根据访问Web页面的不同操作，从所述Web服务器获取与所述操作相对应的目标组件，并加载包括所述目标组件的Web页面。与现有技术相比，本发明利用单页Web框架技术，使得用户在任务操作过程中不会被页面跳转干扰，大大降低了移动终端Web页面间跳转出现的卡顿问题，整个任务流程在一个页面内完成，有效提升了人机交互的效率和舒适度。

技术领域

本发明涉及计算机技术领域，特别涉及一种在移动终端的浏览器内加载Web(World Wide Web，万维网)页面的方法及系统。

背景技术

目前，OTA(Online Travel Agent，在线旅行社)移动端网站一般采用传统的分页面加载形式，用户从表达搜索意向、浏览搜索结果、选择意向订单以及填写订单信息，每一步流程都需要跳转新的页面，每个页面对应独立的URL(Uniform Resource Locator，统一资源定位符)。window.location对象用于获得当前页面的地址(URL)，并把浏览器重定向到新的页面。

通过分页面加载形式在WebApp(基于Web的系统和应用)中切换页面时，一方面，由于不同机型、不同浏览器的渲染技术差异，很容易出现白屏卡顿等不流畅的现象，严重影响用户体验；另一方面，用户切换到下一个页面时，可能会因为网络问题加载时间过长造成用户的流失，导致页面的跳失率变高。其中，跳失率是指显示顾客通过相应入口进入，只访问了一个页面就离开的访问次数占该页面总访问次数的比例。

发明内容

本发明要解决的技术问题是为了克服现有技术中window.location页面跳转时存在卡顿、不流畅以及加载时间过长等的缺陷，提供一种在移动终端的浏览器内加载Web页面的方法及系统。

本发明是通过下述技术方案来解决上述技术问题的：

一方面，本发明提供一种在移动终端的浏览器内加载Web页面的方法，其特点在于，包括以下步骤：

将构成目标Web页面的不同元素封装进多个组件中，并将所述组件存储于Web服务器；

从所述Web服务器获取预设的组件，并加载包括所述预设的组件的初始Web页面；

根据访问Web页面的不同操作，从所述Web服务器获取与所述操作相对应的目标组件，并加载包括所述目标组件的Web页面。

较佳地，通过Ajax异步加载技术从所述Web服务器获取组件。

较佳地，加载Web页面的步骤包括：

按照所述浏览器的模板对获取的组件进行渲染；

加载包括渲染后的组件的Web页面。

较佳地，所述方法还包括：记录访问Web页面的路径，并根据所述路径从所述Web服务器获取目标组件。

较佳地，所述操作的类型包括点击和/或手势。

另一方面，本发明还提供一种在移动终端的浏览器内加载Web页面的系统，其特点在于，包括：

封装模块，用于将构成目标Web页面的不同元素封装进多个组件中，并将所述组件存储于Web服务器；

初始化模块，用于从所述Web服务器获取预设的组件，并加载包括所述预设的组件的初始Web页面；

处理模块，用于根据访问Web页面的不同操作，从所述Web服务器获取与所述操作相对应的目标组件，并加载包括所述目标组件的Web页面。