用户终端及网页图片资源加载装置与方法制造方法及图纸

本发明专利技术实施例提供了一种用户终端及网页图片资源加载装置与方法，涉及浏览器技术领域。该用户终端及网页图片资源加载装置与方法，在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则，从而不会屏蔽使用背景图来体现视觉效果的网页的部分功能入口(可点击的链接)以及网页上使用了map/area机制的图片资源，使得用户可使用图片资源可正常使用相关功能，从而提高了用户的体验感。

User terminal and web page picture resource loading device and method

The embodiment of the invention provides a user terminal and a web page picture resource loading device and a method, which relates to the browser technology field. The user terminal and the web page picture resource loading device and method, parse the obtained page data in the non graph browsing mode to generate the DOM tree; traverse and detect whether the DOM tree node in the described DOM tree includes the external picture resources that need to be loaded; and whether the DOM tree node is required to load on the basis of whether there is a need to load The external picture resources are used to determine the loading rules of the external picture resources, thus not shielding the functional entry (clickable link) of a web page that uses the background map to reflect the visual effect and the picture resources using the map/area mechanism on the web page so that users can make use of the picture resources to use the relevant functions normally. And it improves the user's sense of experience.

【技术实现步骤摘要】
用户终端及网页图片资源加载装置与方法
本专利技术涉及浏览器
，具体而言，涉及一种用户终端及网页图片资源加载装置与方法。
技术介绍
移动浏览器是移动终端(智能手机/平板)用户浏览移动互联网网页的主要工具。由于其主要的网络接入方式是无线运营商网络，怎样减少用户的无线运营商网络流量(尤其国内的无线运营商网络流量费用处于较高的水平)，是移动浏览器在功能实现上需要重点关注的命题。移动互联网网页主要的流量消耗是图片/视频/音频等多媒体资源。现有技术中主流的移动浏览器都提供了无图模式功能，为对无线运营商网络流量敏感的用户提供了有效减少流量的一种可选的方式。但移动浏览器当前实现的无图模式，是相对粗糙的，其会直接屏蔽网页上所有外联的图片资源加载。当然，这种实现方式，可以让减少图片流量的效果最大化。但在某些场景下，会导致网页自身的功能出现缺失。例如，通过对不同网页的有图/无图模式的对比，主要有以下两种场景，无图模式会带来一定的负体验。1.网页上有部分功能入口(可点击的链接)使用背景图来体现视觉效果。无图模式下，这些功能入口视觉上不可见，用户不能正常使用相关功能(比如站点的功能网页的切换)。2.网页上使用了基于图片资源的map/area机制，在图片上定义了不同的点击区域，无图模式下，由于图片被屏蔽，这些可点击区域对用户不可见，从而也导致了用户不能正常使用相关功能。
技术实现思路
本专利技术的目的在于提供一种用户终端及网页图片资源加载装置与方法，以改善上述的问题。为了实现上述目的，本专利技术实施例采用的技术方案如下：第一方面，本专利技术实施例提供了一种网页图片资源加载装置，所述网页图片资源加载装置包括：页面解析单元，用于在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；检测单元，用于遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；图片资源加载单元，用于依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。第二方面，本专利技术实施例提供了一种网页图片资源加载方法，所述网页图片资源加载方法包括：在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。第三方面，本专利技术实施例还提供了一种用户终端，所述用户终端包括：存储器；处理器；及网页图片资源加载装置，所述装置安装于所述存储器中并包括一个或多个由所述处理器执行的软件功能模块，所述网页图片资源加载装置包括：页面解析单元，用于在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；检测单元，用于遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；图片资源加载单元，用于依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。本专利技术实施例提供的一种用户终端及网页图片资源加载装置与方法，在无图浏览模式下，在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则，从而不会屏蔽使用背景图来体现视觉效果的网页的部分功能入口(可点击的链接)以及网页上使用了map/area机制的图片资源，使得用户可使用图片资源可正常使用相关功能，从而提高了用户的体验感。为使本专利技术的上述目的、特征和优点能更明显易懂，下文特举较佳实施例，并配合所附附图，作详细说明如下。附图说明为了更清楚地说明本专利技术实施例的技术方案，下面将对实施例中所需要使用的附图作简单地介绍，应当理解，以下附图仅示出了本专利技术的某些实施例，因此不应被看作是对范围的限定，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他相关的附图。图1示出了本专利技术较佳实施例提供的用户终端及网页图片资源加载装置与方法的应用环境示意图；图2示出了本专利技术较佳实施例提供的网页页面渲染的处理方式的架构框图；图3示出了本专利技术较佳实施例提供的用户终端的结构框图；图4示出了本专利技术较佳实施例提供的网页页面显示状态的示意图；图5示出了本专利技术较佳实施例提供的网页图片资源加载装置的功能模块图；图6示出了本专利技术较佳实施例提供的一种网页图片资源加载方法的流程图。图标；100-用户终端；200-服务器；300-网络；401-页面解析单元；402-检测单元；403-图片资源加载单元；404-判断单元；405-网页显示单元；406-外联图片资源；101-网页图片资源加载装置；102-存储器；103-存储控制器；104-处理器；105-外设接口；106-射频模块；107-音频模块；108-触控屏幕。具体实施方式下面将结合本专利技术实施例中附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。通常在此处附图中描述和示出的本专利技术实施例的组件可以以各种不同的配置来布置和设计。因此，以下对在附图中提供的本专利技术的实施例的详细描述并非旨在限制要求保护的本专利技术的范围，而是仅仅表示本专利技术的选定实施例。基于本专利技术的实施例，本领域技术人员在没有做出创造性劳动的前提下所获得的所有其他实施例，都属于本专利技术保护的范围。应注意到：相似的标号和字母在下面的附图中表示类似项，因此，一旦某一项在一个附图中被定义，则在随后的附图中不需要对其进行进一步定义和解释。同时，在本专利技术的描述中，术语“第一”、“第二”等仅用于区分描述，而不能理解为指示或暗示相对重要性。本专利技术较佳实施例所提供的用户终端及网页图片资源加载装置与方法可应用于如图1所示的应用环境中。如图1所示，用户终端100、服务器200位于网络300中，通过该网络300，用户终端100与服务器200进行数据交互。于本专利技术实施例中，用户终端100中安装有至少一个应用程序(Application，APP)，与服务器200相对应，为用户提供服务。如图2所示，在用户通过应用程序(例如，浏览器)输入网页加载指令时，具体网页加载方式如下：应用程序查找域名的IP地址，再向服务器200发送一个HTTP请求，服务器200发送永久重定向响应，应用程序跟踪重定向地址，服务器200“处理”请求，并发回一个HTML响应，用户终端100安装的应用程序在接收到HTML响应后，即开始加载网页资源，并对网页资源进行渲染与显示。网页资源渲染方式如图2所示，具体地，首先是将加载到的网页资源输入到HTML解释器，HTML解释器在解释网页资源后构建成一棵DOM树，在这期间如果遇到javascript代码则交给javascript引擎去处理；如果网页资源中包含CSS，则交给CSS解释器去解释。当DOM树建立的时候，渲染引擎解释来自CSS解释器的样式信息，构建一个新的内部绘图模型。该模型由布局模块计算模型内部各个元素的位置和大小信息，最后由绘图模块完成从该模型到图像的绘制，从而将网页资源渲染完毕展示于用户终端100的网页页面。于本专利技术实施例中，用户终端100优选为移动终端设备，例如可以包括智能手机、本文档来自技高网...

【技术保护点】
1.一种网页图片资源加载装置，其特征在于，所述网页图片资源加载装置包括：页面解析单元，用于在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；检测单元，用于遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；图片资源加载单元，用于依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。

【技术特征摘要】
1.一种网页图片资源加载装置，其特征在于，所述网页图片资源加载装置包括：页面解析单元，用于在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；检测单元，用于遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；图片资源加载单元，用于依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。2.根据权利要求1所述的网页图片资源加载装置，其特征在于，所述图片资源加载单元用于若当前的DOM树节点包括有需要加载的外联图片资源时，按照预设的图片资源加载规则加载所述外联图片资源，以及用于若当前的DOM树节点不包括有需要加载的外联图片资源时，不加载所述外联图片资源。3.根据权利要求1所述的网页图片资源加载装置，其特征在于，所述图片资源加载单元用于若DOM树节点包括有需要加载的外联图片资源，且引用所述外联图片资源的功能入口标签为可视化标签且具有点击属性时，加载所述外联图片资源。4.根据权利要求1所述的网页图片资源加载装置，其特征在于，所述图片资源加载单元用于若所述DOM节点包括有需要加载的外联图片资源，且引用所述外联图片资源的功能入口标签为可视化标签且具有点击属性，且所述外联图片资源的宽度、高度、宽高比以及高宽比分别符合预定范围时，加载所述外联图片资源。5.根据权利要求1所述的网页图片资源加载装置，其特征在于，若所述外联图片资源为图像标签所引用，且所述图像标签具有usemap属性时，加载所述外联图片资源。6.根据权利要求1所述的网页图片资源加载装置，其特征在于，所述网页图片资源加载装置还包括：网页显示单元，用于在页面解析完毕时，渲染生成的DOM树以显示网页内容。7.一种网页图片资源加载方法，其特征在于，所述网页图片资源加载方法包括：在无图浏览模式下，对获取到的网页数据进行页面解析以生成DOM树；遍历并检测所述DOM树中的DOM树节点是否包括有需要加载的外联图片资源；依据所述DOM树节点是否包括有需要加载的外联图片资源而确定所述外联图片资源的加载规则。8.根据权利要求7所述的网页图片资源加载方法，其特征在于，所述依据所述DOM树节点是否包括有需要加载的外联图片资源而确定...

【专利技术属性】
技术研发人员：吴伟勇，
申请(专利权)人：广州市动景计算机科技有限公司，
类型：发明
国别省市：广东,44