网页多媒体内容处理方法及装置的制造方法
【技术领域】
[0001]本发明涉及互联网技术领域，尤其涉及一种网页多媒体内容处理方法及装置。
【背景技术】
[0002]随着互联网技术的不断发展，网页内容也日益丰富起来。一般来说，网页除包含文字内容外，还包含例如图片、音频、视频等多媒体内容。与文字内容相比，多媒体内容更加生动形象，对用户更具有吸引力，能够高效为用户提供丰富的信息。
[0003]以图片为例，过多的图片会导致客户端页面加载速度降低，带宽流量和内存消耗增大，降低用户体验。同时，还会给服务器造成过大压力。为解决上述问题，目前常采用图片懒加载的方式，即是当用户浏览到当前区域时才加载区域内的全部图片。
[0004]然而，这种方式仅能够通过对特定事件(如页面滚动事件)进行响应来触发包括图片、视频、音频等多媒体内容的加载，具有触发条件单一、容器非浏览器原生滚动容器导致技术不通用、开发成本高、开发效率低等不足之处。
【发明内容】
[0005]本发明实施例的目的在于，提供一种网页多媒体内容处理方法及装置，以实现在用户浏览网页过程中，将浏览器视窗内的多媒体内容准确、及时地加载到网页中，使其具有通用性并提升用户体验。
[0006]为实现上述发明目的，本发明的实施例提供了一种网页多媒体内容处理方法，包括:网页内容获取步骤:获取网页内容数据；多媒体网页元素提取步骤:从所述网页内容数据提取与多媒体内容相关的网页元素的信息，并记录提取到的所述网页元素的信息；网页内容显示步骤:加载页面中除了所述多媒体内容以外的网页内容，并且显示加载的网页内容;多媒体内容加载步骤:通过单独的线程，从记录的所述网页元素的信息中获取位于浏览器视窗内的网页元素的信息，并将位于浏览器视窗内的所述网页元素对应的多媒体内容加载到网页中。
[0007]优选地，所述多媒体网页元素提取步骤的处理还包括:将所述网页内容数据当中提取到的所述网页元素的数据替换为指定的默认信息。
[0008]优选地，所述多媒体内容加载步骤的处理包括:对所述记录的所述网页元素的信息中的任一网页元素的信息，获取所述网页元素相对于浏览器视窗的位置数据，如果其位置当前是处于在浏览器视窗中，则根据所述网页元素的信息从网页服务器获取相应的多媒体内容数据，并且将所述网页元素对应的多媒体内容加载到网页中。
[0009]优选地，所述网页元素的信息包括所述多媒体内容的下载地址或下载链接。
[0010]优选地，所述方法还包括:从所述记录的所述网页元素的信息中移除已加载的网页元素以及相应的网页元素的信息。
[0011]优选地，以预定的时间间隔执行所述多媒体内容加载步骤的处理。
[0012]优选地，所述指定的默认信息是指定的文本信息、空白图片或指定的图片。
[0013]本发明的实施例还提供了一种网页多媒体内容处理装置，包括:网页内容获取模块，用于获取网页内容数据;多媒体网页元素提取模块，用于从所述网页内容数据提取与多媒体内容相关的网页元素的信息，并记录提取到的所述网页元素的信息；网页内容显示模块，用于加载页面中除了所述多媒体内容以外的网页内容，并且显示加载的网页内容;多媒体内容加载模块，用于通过单独的线程，从记录的所述网页元素的信息中获取位于浏览器视窗内的网页元素的信息，并将位于浏览器视窗内的所述网页元素对应的多媒体内容加载到网页中。
[0014]优选地，所述多媒体网页元素提取模块还用于将所述网页内容数据当中提取到的所述网页元素的数据替换为指定的默认信息。
[0015]优选地，所述多媒体内容加载模块用于对所述记录的所述网页元素的信息中的任一网页元素的信息，获取所述网页元素相对于浏览器视窗的位置数据，如果其位置当前是处于在浏览器视窗中，则根据所述网页元素的信息从网页服务器获取相应的多媒体内容数据，并且将所述网页元素对应的多媒体内容加载到网页中。
[0016]优选地，所述网页元素的信息包括所述多媒体内容的下载地址或下载链接。
[0017]优选地，所述装置还包括:网页元素移除模块，用于从所述记录的所述网页元素的信息中移除已加载的网页元素以及相应的网页元素的信息。
[0018]优选地，所述多媒体内容加载模块用于以预定的时间间隔执行所述通过单独的线程，从记录的所述网页元素的信息中获取位于浏览器视窗内的网页元素的信息，并将位于浏览器视窗内的所述网页元素对应的多媒体内容加载到网页中的处理。
[0019]优选地，所述指定的默认信息是指定的文本信息、空白图片或指定的图片。
[0020]本发明实施例提供的网页多媒体内容处理方法及装置，在获取网页内容数据后，进一步从网页内容数据提取与多媒体内容相关的网页元素的信息，并记录提取到的网页元素的信息，通过单独的线程，从记录的网页元素的信息中获取位于浏览器视窗内的网页元素的信息，从而自动、准确地将所述网页元素对应的多媒体内容加载到网页中。可见，本实施例所述方法无需依赖于对某个或某些事件进行响应，或者特定的编程语言或架构来触发对多媒体内容的加载，进而使其具有通用性，并极大地提升了用户体验。由此，提高了开发效率，降低了开发成本。
【附图说明】
[0021]图1是示出本发明实施例一的网页多媒体内容处理方法的流程图；
[0022]图2是示出本发明实施例二的网页多媒体内容处理装置的逻辑框图。
【具体实施方式】
[0023]本发明的基本构思是，提供一种基于轮询队列的多媒体内容懒加载方式:从获取到的网页内容数据提取与多媒体内容相关的网页元素的信息，并记录提取到的网页元素的信息，由此，可基于记录的网页元素的信息，自动而准确地获取位于浏览器视窗内的网页元素的信息，并将位于浏览器视窗内的网页元素对应的多媒体内容加载到网页中，同时加载页面中除了所述多媒体内容以外的网页内容，并且显示加载的网页内容，提升用户网络体验。
[0024]此外，与现有的图片懒加载方法相比，本发明实施例所述的网页多媒体内容处理方法通用性、灵活性更强，进而降低开发成本，提高开发效率。
[0025]下面结合附图详细描述本发明实施例的网页多媒体内容处理方法及装置。
[0026]实施例一
[0027]图1是示出本发明实施例一的网页多媒体内容处理方法的流程图。可在如图2所示的装置上执行该方法。
[0028]参照图1，在步骤S110，获取网页内容数据。
[0029]具体地，当用户点击某个网页链接或完成输入网址后，通过HTTP/HTTPS请求来从网页服务器获取相应的网页内容数据。
[0030]在步骤S120，从所述网页内容数据提取与多媒体内容相关的网页元素的信息，并记录提取到的所述网页元素的信息。
[0031]具体地，可通过将提取到的所述网页元素的信息插入待加载多媒体内容队列来完成网页元素的信息的记录过程。
[0032]根据本发明的示例性实施例，步骤S120还可包括:将所述网页内容数据当中提取到的所述网页元素的数据替换为指定的默认信息。需要说明的是，所述指定的默认信息可以是，但不限于，指定的文本信息、空白图片或指定的图片。这里，所述网页元素的信息可包括所述多媒体内容的下载地址或下载链接。
[0033]在具体的实现方式中，〈img>标签的src属性是图片的统一资源定位符(UniformResource Locator，URL)，也就是引用该图片的绝对路径或相对路径。例如源代码“〈imgsrc = 〃/i/eg_chinarose.jpg〃/>”，其加载显示后是一张关于月季花的图片。下面以“图片”为例进行详细说明，从网页内容数据提取与图片相关的文档对象模型(Document ObjectModel，D0M)对象，例如img对象，将img对象添加到待加载图片队列中，保存其下载链接，方便后续图片加载的处理。并将img对象的src属性指向空白图片或者指定的图片(如loading图片的地址)，以使浏览器暂时阻止加载图片。
[0034]在步骤S130，加载页面中除了所述多媒体内容以外的网页内容，并且显示加载的网页内容。
[0035]此时，与网页中的多媒体内容相关的数据被显示为前述指定的默认信息，而不即时加载这些多媒体内容。
[0036]在步骤S140，通过单独的线程，从记录的所述网页元素的信息中获取位于浏览器视窗内的网页元素的信息，并将位于浏览器视窗内的所述网页元素对应的多媒体内容加载到网页中。
[0037]根据本发明的示例性实施例，步骤S140可包括:对记录的网页元素的信息中的任一网页元素的信息，获取所述网页元素相对于浏览器视窗的位置数据，如果其位置当前是处于在浏览器视窗中，则根据所述网页元素的信息从网页服务器获取相应的多媒体内容数据，并且将所述网页元素对应的多媒体内容加载到网页中。
[0038]在具体的实现方式中，可通过遍历前述待加载多媒体内容队列的方式，获取位于浏览器视窗内的网页元素的信息，并根据获取的网页元素的信息将位于浏览器视窗内的网页元素对应的多媒体内容加载到网页中。通常，利用getBoundingClientRect函数获得网页中某个网页元素的左、上、右和下分别相对浏览器视窗的位置。相应地，本实施例可通过D0M对象的getBoundingClientRect函数来获得图片相对于浏览器视窗的位置数据，根据获得的位置数据判断图片是否处于浏览器视窗中。仍以“图片”为例，如果图片位于浏览器视窗内，则从待加载图片队列提取保存的下载链接(即原始的下载地址)，将src属性从前述空白图片替换成所述下载链接，从网页服务器获取与所述下载链接