CN106844451A - 一种多媒体信息预加载的方法及装置 - Google Patents

Abstract

本发明实施例提供了一种多媒体信息预加载的方法及装置，所述方法包括：判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。应用本发明实施例能够有效解决浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，减少用户等待的时间，提升用户体验。

Description

一种多媒体信息预加载的方法及装置

技术领域

本发明涉及互联网信息技术领域，尤其涉及一种多媒体信息预加载的方法及装置。

背景技术

随着互联网的快速发展，多媒体信息在网上的传输越来越重要。多媒体信息主要是指以图片、视频、声音和动画等为表现形式的媒体信息。一些网站在加载这些多媒体信息时，使用即用即加载的方法，即在浏览器需要加载这些多媒体信息时，直接下载该多媒体信息，并将其显示在浏览器中。

但是，在现有的多媒体信息加载技术中，当用户用到这个多媒体的信息时，浏览器才发出请求，然后再从服务器下载这个多媒体的信息，这样，就造成了浏览页面的时间有所延迟，增加了用户的等待时间。另外，如果一个多媒体的信息过于庞大，页面就会长时间的展现为一片空白，从而导致用户不能及时获取所需信息，影响用户体验。

发明内容

有鉴于此，本发明实施例的目的在于提供一种多媒体信息预加载的方法及装置，解决浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，减少用户等待的时间，提升用户体验。

为达到上述目的，本发明实施例公开了一种多媒体信息预加载的方法，所述方法包括：

判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

可选的，所述下载所述待下载的多媒体信息之前，所述的方法还包括：

检测所述浏览器的当前页面的已显示区域是否有正在下载的信息；

相应的，如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中，包括：

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，且所述当前页面的已显示区域没有正在下载的信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

可选的，所述检测所述浏览器的当前页面的已显示区域是否有正在下载的信息，包括：

在所述当前页面初始化时创建所述当前页面的已显示区域的多媒体信息下载事件，通过监听所述多媒体信息下载事件，检测所述浏览器的当前页面的已显示区域是否有正在下载的信息。

可选的，所述下载所述待下载的多媒体信息之后，所述的方法还包括：

监听所述当前页面的已显示区域之外是否有多媒体信息加载事件，当所述当前页面的已显示区域之外有所述多媒体信息加载事件时，从所述本地缓存中调用所述待下载的多媒体信息，并显示在所述浏览器中。

可选的，所述判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息，包括：

使用客户端脚本在所述浏览器的已加载页面创建标识，所述标识包括所述已加载页面的多媒体信息的已下载数量；

根据所述客户端脚本中所述浏览器的所有页面的多媒体信息数量和所述已加载页面的多媒体信息的已下载数量，判断所述浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。

可选的，所述客户端脚本为JavaScript。

本发明实施例还公开了一种多媒体信息预加载的装置，所述装置包括：

判断单元，用于判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；

下载单元，用于如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

可选的，所述判断单元，还用于：

检测所述浏览器的当前页面的已显示区域是否有正在下载的信息；

相应的，所述下载单元，还用于：

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，且所述当前页面的已显示区域没有正在下载的信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

可选的，所述判断单元，还用于：

在所述当前页面初始化时创建所述当前页面的已显示区域的多媒体信息下载事件，通过监听所述多媒体信息下载事件，检测所述浏览器的当前页面的已显示区域是否有正在下载的信息。

可选的，所述下载单元，还用于：

监听所述当前页面的已显示区域之外是否有多媒体信息加载事件，当所述当前页面的已显示区域之外有所述多媒体信息加载事件时，从所述本地缓存中调用所述待下载的多媒体信息，并显示在所述浏览器中。

由上述的技术方案可见，本发明实施例提供的一种多媒体信息预加载的方法及装置，通过判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息，以及检测浏览器的当前页面的已显示区域是否有正在下载的信息，然后下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中，当页面需要加载该多媒体信息时可以直接从本地缓存中调用。该方法及装置有效的解决了浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，减少了用户等待的时间，提升了用户体验。当然，实施本发明的任一产品或方法必不一定需要同时达到以上所述的所有优点。

附图说明

为了更清楚地说明本发明实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本发明实施例提供的一种多媒体信息预加载的方法的流程图；

图2为本发明实施例提供的一种浏览器的当前页面的已显示区域的应用示意图；

图3为本发明实施例提供的一种多媒体信息预加载的装置的结构图。

具体实施方式

下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。

现有的多媒体信息加载的方法有的使用异步加载，比如点击加载更多，下拉加载更多，或者翻页等；有的在页面加载的时候就全部提前加载并先隐藏，等用的时候再显示出来，都会增加页面加载延迟问题，如果全部提前加载，那么页面加载的等待时间会更长。由此看来，提供一种多媒体信息预加载的方法及装置，来避免浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，是非常必要的。

参见图1，图1为本发明实施例提供的一种多媒体信息预加载的方法的流程图，包括如下步骤：

S101，判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；

具体的，要实现多媒体信息预加载，就需要判断是否有需要预加载的多媒体信息。当浏览一个网页时，如图2所示，图2为本发明实施例提供的一种浏览器的当前页面的已显示区域的应用示意图，其中包括当前页面已显示出的各种多媒体信息，如图片、动画、视频等。但对于一个浏览器的网页来说，它包含很多个多媒体信息，并不仅仅是图2中的当前页面的已显示区域所显示出来的多媒体信息，还包括除当前页面的已显示区域之外的多媒体信息。如果当前页面的已显示区域之外需要加载其他的多媒体信息，则需要先获取该多媒体信息的下载地址，然后服务器根据该下载地址下载该多媒体信息，再将已下载的多媒体信息加载到所需页面。

本发明中所提到的多媒体信息预加载的方法，需要提前将当前页面的已显示区域之外的多媒体信息下载下来，这就需要先判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。其中，多媒体信息是指以图片、视频、声音和动画等为表现形式的媒体信息。这里，下载是指根据该多媒体信息的下载路径从服务器去下载该多媒体信息，而加载是将下载的多媒体信息加载到页面中，待加载是还不需要加载到页面的多媒体信息。当前页面的已显示区域指的是在当前页面上已经显示出来的所有的信息所在的区域，也就是用户当前可以看到的显示内容的显示区域。

S102，如果当前页面的已显示区域之外有待下载的多媒体信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。

具体的，通过判断浏览器的当前页面的已显示区域之外有待下载的多媒体信息，才能实现多媒体信息的预加载，即下载待下载的多媒体信息，由于待下载的多媒体信息是预先下载的，而浏览器的当前页面还不需要加载该多媒体信息，所以需要将该多媒体信息先存储起来，等需要的时候再调用。这里，将待下载的多媒体信息存储在浏览器的本地缓存中，是为了节约网络资源并加速浏览。缓存的方式节约了网络的资源，提高了网络的效率。

由此可见，本发明实施例提供的一种多媒体信息预加载的方法，通过判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；如果当前页面的已显示区域之外有待下载的多媒体信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。这种将待下载的多媒体信息预加载的方法有效的解决了浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，减少了用户等待的时间，提升了用户体验。

在本发明实施例中，下载待下载的多媒体信息之前，本发明实施例提供的方法还包括：

检测浏览器的当前页面的已显示区域是否有正在下载的信息；

具体的，检测浏览器的当前页面的已显示区域是否处于空闲状态，即当前页面的已显示区域是否有正在下载的信息。由于在下载待下载的多媒体信息之前，如果仅仅只是判断浏览器的当前页面的已显示区域之外有待下载的多媒体信息，就下载该待下载的多媒体信息，是可以实现待下载的多媒体信息的预加载，但是并未考虑浏览器的当前页面的下载速度，如果当前页面的下载量比较大时，再预加载待下载的多媒体信息，这样可能会造成当前页面的下载速度减慢。因此，这里考虑检测浏览器的当前页面的已显示区域是否有正在下载的信息，是为了防止预加载待下载的多媒体信息时影响当前页面的已显示区域的下载速度。这里，根据检测浏览器的当前页面的已显示区域是否有正在下载的信息，确定是否要下载待下载的多媒体信息。如果当前页面的已显示区域有正在下载的信息，则不下载待下载的多媒体信息，防止影响当前页面的已显示区域的下载速度；如果当前页面的已显示区域没有正在下载的信息，则下载待下载的多媒体信息。

相应的，如果当前页面的已显示区域之外有待下载的多媒体信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中，包括：

如果当前页面的已显示区域之外有待下载的多媒体信息，且当前页面的已显示区域没有正在下载的信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。

具体的，当同时满足当前页面的已显示区域之外有待下载的多媒体信息，和当前页面的已显示区域没有正在下载的信息时，下载待下载的多媒体信息。这样，可以不影响当前页面的已显示区域的下载速度。这里，将待下载的多媒体信息存储在浏览器的本地缓存中，当页面需要下载该多媒体信息时，可以直接从本地缓存中调用该多媒体信息，不仅使用方便，而且减少了下载时间，提高了页面加载速度。

而在现有技术中，页面在加载时直接加载多媒体信息。例如，页面加载时，如果网速较慢，多媒体信息又比较多，浏览器上会显示等待中或者正在加载中的图标，说明浏览器一直正在加载页面，包括里面的这些图片、小视频等多媒体信息。在这些多媒体信息和页面元素没有完全加载完成的时候，浏览器上的等待中或者正在加载中的图标会一直显示在页面中，而此时页面功能性的代码还没有完全加载完成，很可能造成有一些功能暂时用不了，必须等页面加载完成以后才能使用。

可见，通过本发明实施例提供的方法，先确定当前页面的已显示区域之外有待下载的多媒体信息，再确定当前页面的已显示区域没有正在下载的信息时，这时，再下载待下载的多媒体信息，就不会造成页面加载的等待时间，以及避免页面的一些功能暂时用不了的情况，同时提升用户体验。

在本发明实施例中，检测浏览器的当前页面的已显示区域是否有正在下载的信息，包括：

在当前页面初始化时创建当前页面的已显示区域的多媒体信息下载事件，通过监听多媒体信息下载事件，检测浏览器的当前页面的已显示区域是否有正在下载的信息。

具体的，在页面初始化时创建当前页面的已显示区域的多媒体信息下载事件，来实时监听当前页面的已显示区域的状态，并根据当前页面的已显示区域的状态检测浏览器的当前页面的已显示区域是否有正在下载的信息。例如，当我们打开一个网页的网址，页面就会进行初始化，接着就会触发pageload事件，页面所有要加载的内容都会在pageload里面写出来，也就是说如果要加载多媒体信息，则就会将该多媒体信息的相关代码写在pageload里面，那么就可以通过pageload实时监听当前页面的已显示区域的多媒体信息下载事件，即如果有多媒体信息下载事件，pageload里面就会写对应有写该多媒体信息的相关代码。在本发明实施例中，下载待下载的多媒体信息之后，本发明实施例提供的方法还包括：

监听当前页面的已显示区域之外是否有多媒体信息加载事件，当当前页面的已显示区域之外有多媒体信息加载事件时，从本地缓存中调用待下载的多媒体信息，并显示在浏览器中。

具体的，先监听当前页面的已显示区域之外是否有多媒体信息加载事件，如果当前页面的已显示区域之外有多媒体信息加载事件时，那么就可以直接调用在本地缓存中存储的待下载的多媒体信息，并将该多媒体信息显示在浏览器中。这种通过直接调用以存储的已预加载的多媒体信息的方法，减少了操作等待时间。这里，多媒体信息加载事件指用于加载剩余多媒体信息的指令，例如，可以是用户滚动到页面底部时触发该多媒体信息加载，也可以是用户点击某个按钮触发该多媒体信息加载，这个可以根据需求来设置。

在本发明可选的实施例中，判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息，包括：

使用客户端脚本在浏览器的已加载页面创建标识，标识包括已加载页面的多媒体信息的已下载数量；

由于HTML(Hyper Text Markup Language，超文本标记语言)所提供的页面信息绝大多数都是静态的，通过浏览器显示给用户后，页面内容固定不变，缺少动态的和交互的效果，因此各种脚本语言应运而生，它们实现了客户端页面的动态效果，提高了页面的交互性，同时使用简单、方便。

通常，客户端脚本是指运行在客户端的脚本程序，一般是不经过数据库，不经过其他编译软件编译，直接写在网站代码里的。目前较为常见的客户端脚本语言是JavaScript和VBScript。

这里，通过现有的客户端脚本语言在浏览器的已加载页面创建标识，来判断是否有即将要下载的多媒体信息，其中，该标识包括所有已加载过的页面的多媒体信息的已下载数量。例如，多媒体信息中的图片的加载是根据页面中的img标签中加载图片的路径来加载的，在页面初次加载时，我们先不需要直接在img标签中加载图片路径，而是先在页面创建标识，来判断已加载页面中已经有多少个img标签了，从而算出多少个还没有下载出来的img标签，然后再根据图片路径加载图片。

根据客户端脚本中浏览器的所有页面的多媒体信息数量和已加载页面的多媒体信息的已下载数量，判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。

具体的，已知客户端脚本中浏览器的所有页面的多媒体信息数量和已加载页面的多媒体信息的已下载数量，将客户端脚本中浏览器的所有页面的多媒体信息数量，减去已加载页面的多媒体信息的已下载数量，就可以算出浏览器的当前页面的已显示区域之外的多媒体信息的待下载数量，从而判断出浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。

在本发明可选的实施例中，客户端脚本为JavaScript。

具体的，JavaScript是一种嵌入HTML的脚本语言，它不需要编译，在客户端可以通过浏览器解释执行。另外，JavaScript具有跨平台、基于对象和事件驱动的特点，而且它的兼容性好，具有更高的安全性和执行效率。

参见图3，图3为本发明实施例提供的一种多媒体信息预加载的装置的结构图，包括如下单元：

判断单元301，用于判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。

下载单元302，用于如果当前页面的已显示区域之外有待下载的多媒体信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。

进一步的，判断单元301，还用于：

检测浏览器的当前页面的已显示区域是否有正在下载的信息。

相应的，下载单元302，还用于：

如果当前页面的已显示区域之外有待下载的多媒体信息，且当前页面的已显示区域没有正在下载的信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。

进一步的，判断单元301，还用于：

在当前页面初始化时创建当前页面的已显示区域的多媒体信息下载事件，通过监听多媒体信息下载事件，检测浏览器的当前页面的已显示区域是否有正在下载的信息。

进一步的，下载单元302，还用于：

监听当前页面的已显示区域之外是否有多媒体信息加载事件，当当前页面的已显示区域之外有多媒体信息加载事件时，从本地缓存中调用待下载的多媒体信息，并显示在浏览器中。

由此可见，本发明实施例提供的一种多媒体信息预加载的装置，通过判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；如果当前页面的已显示区域之外有待下载的多媒体信息，则下载待下载的多媒体信息，并将待下载的多媒体信息存储在浏览器的本地缓存中。这种将待下载的多媒体信息预加载的装置有效的解决了浏览器在加载多媒体信息的过程中所造成的页面内容加载延迟问题，减少了用户等待的时间，提升了用户体验。

需要说明的是，在本文中，诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。

本说明书中的各个实施例均采用相关的方式描述，各个实施例之间相同相似的部分互相参见即可，每个实施例重点说明的都是与其他实施例的不同之处。尤其，对于***实施例而言，由于其基本相似于方法实施例，所以描述的比较简单，相关之处参见方法实施例的部分说明即可。

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

Claims (10)

1.一种多媒体信息预加载的方法，其特征在于，所述方法包括：

判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

2.根据权利要求1所述的方法，其特征在于，所述下载所述待下载的多媒体信息之前，所述的方法还包括：

检测所述浏览器的当前页面的已显示区域是否有正在下载的信息；

相应的，如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中，包括：

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，且所述当前页面的已显示区域没有正在下载的信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

3.根据权利要求2所述的方法，其特征在于，所述检测所述浏览器的当前页面的已显示区域是否有正在下载的信息，包括：

在所述当前页面初始化时创建所述当前页面的已显示区域的多媒体信息下载事件，通过监听所述多媒体信息下载事件，检测所述浏览器的当前页面的已显示区域是否有正在下载的信息。

4.根据权利要求1～3任一项所述的方法，其特征在于，所述下载所述待下载的多媒体信息之后，所述的方法还包括：

监听所述当前页面的已显示区域之外是否有多媒体信息加载事件，当所述当前页面的已显示区域之外有所述多媒体信息加载事件时，从所述本地缓存中调用所述待下载的多媒体信息，并显示在所述浏览器中。

5.根据权利要求4所述的方法，其特征在于，所述判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息，包括：

使用客户端脚本在所述浏览器的已加载页面创建标识，所述标识包括所述已加载页面的多媒体信息的已下载数量；

根据所述客户端脚本中所述浏览器的所有页面的多媒体信息数量和所述已加载页面的多媒体信息的已下载数量，判断所述浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息。

6.根据权利要求5所述的方法，其特征在于，所述客户端脚本为JavaScript。

7.一种多媒体信息预加载的装置，其特征在于，所述装置包括：

判断单元，用于判断浏览器的当前页面的已显示区域之外是否有待下载的多媒体信息；

下载单元，用于如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

8.根据权利要求7所述的装置，其特征在于，所述判断单元，还用于：

检测所述浏览器的当前页面的已显示区域是否有正在下载的信息；

相应的，所述下载单元，还用于：

如果所述当前页面的已显示区域之外有所述待下载的多媒体信息，且所述当前页面的已显示区域没有正在下载的信息，则下载所述待下载的多媒体信息，并将所述待下载的多媒体信息存储在所述浏览器的本地缓存中。

9.根据权利要求8所述的装置，其特征在于，所述判断单元，还用于：

在所述当前页面初始化时创建所述当前页面的已显示区域的多媒体信息下载事件，通过监听所述多媒体信息下载事件，检测所述浏览器的当前页面的已显示区域是否有正在下载的信息。

10.根据权利要求7～9任一项所述的装置，其特征在于，所述下载单元，还用于：

监听所述当前页面的已显示区域之外是否有多媒体信息加载事件，当所述当前页面的已显示区域之外有所述多媒体信息加载事件时，从所述本地缓存中调用所述待下载的多媒体信息，并显示在所述浏览器中。