一种播放视频时加载字幕文件的方法及系统与流程

本发明涉及领域，尤其涉及一种播放视频时加载字幕文件的方法及系统。

背景技术：

随着互联网的普及以及网络带宽的增加，越来越多的人选择通过电视、机顶盒、手机、平板、PC等设备连接网络观看视频节目，享受网络带来的视觉盛宴。作为视频内容提供商或视频网站运营商，播放视频尤其是国外视频时显示字幕是非常有必要的。目前，显示字幕方式分两种，一种是将字幕内嵌于视频中，播放视频无需借助其它技术显示字幕；另一种则是以外挂的形式显示字幕。外挂形式显示字幕又两种：一种是播放器加载外挂字幕，另一种是以网页js插件的形式加载外挂字幕。

相比于内嵌字幕会损失视频清晰度，且编辑字幕难度大的缺点，外挂字幕的优势是可以自定义字体、大小，自由修改字幕内容，做到字幕和视频分离。而在WEB平台通过浏览器播放网络视频加载显示字幕，尤其是在机顶盒设备里的集成播放器如VLC，博通等并没有支持外挂字幕的功能。

因此，现有技术还有待于改进和发展。

技术实现要素：

鉴于上述现有技术的不足，本发明的目的在于提供一种播放视频时加载字幕文件的方法及系统，旨在解决现有技术中WEB平台播放视频不支持外挂字幕的问题。

本发明的技术方案如下：

一种播放视频时加载字幕文件的方法，其中，包括步骤：

在WEB平台通过浏览器播放视频时，根据播放标签获取当前页面的播放对象；

调用用于显示字幕的函数，加载并解析字幕文件，将其中各时间段的时间信息和对应的文字信息分别放入到时间数组和文字数组中；

获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息。

所述的播放视频时加载字幕文件的方法，其中，根据播放标签获取当前页面的播放对象的步骤具体包括：

若当前页面采用HTML5 VIDEO标签，则设置播放对象为HTML5 VIDEO对象；

若当前页面采用HBBTV OBJECT标签，则设置播放对象为HBBTV OBJECT对象。

所述的播放视频时加载字幕文件的方法，其中，获取当前页面的播放对象之后还包括：

根据播放对象的属性值判断是否有设置字幕路径，若有则调用用于显示字幕的函数，若否则流程结束。

所述的播放视频时加载字幕文件的方法，其中，调用用于显示字幕的函数的步骤具体包括：

判断是否存在用于显示字幕的函数，若存在，则直接调用所述函数；若不存在，则用创建一个DIV层，根据当前页面的位置设置DIV层的层叠样式表，再将所述DIV层插入到当前页面中。

所述的播放视频时加载字幕文件的方法，其中，获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息的步骤具体包括：

每隔预定时间获取当前播放时间信息，并与时间数组里的时间信息匹配；

获取相匹配的时间数组的标识；

根据所述标识读取并显示文字数组中对应的文字信息。

一种播放视频时加载字幕文件的系统，其中，包括：

播放对象获取模块，用于在WEB平台通过浏览器播放视频时，根据播放标签获取当前页面的播放对象；

字幕加载模块，用于调用用于显示字幕的函数，加载并解析字幕文件，将其中各时间段的时间信息和对应的文字信息分别放入到时间数组和文字数组中；

字幕显示模块，用于获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息。

所述的播放视频时加载字幕文件的系统，其中，所述播放对象获取模块具体包括：

第一设置单元，用于若当前页面采用HTML5 VIDEO标签，则设置播放对象为HTML5 VIDEO对象；

第二设置单元，若当前页面采用HBBTV OBJECT标签，则设置播放对象为HBBTV OBJECT对象。

所述的播放视频时加载字幕文件的系统，其中，还包括：

字幕路径判断模块，用于根据播放对象的属性值判断是否有设置字幕路径，若有则调用用于显示字幕的函数，若否则流程结束。

所述的播放视频时加载字幕文件的系统，其中，字幕加载模块具体包括：

函数判断单元，用于判断是否存在用于显示字幕的函数；

直接调用单元，用于若存在用于显示字幕的函数，则直接调用所述函数；

函数创建单元，用于若不存在用于显示字幕的函数，则用创建一个DIV层，根据当前页面的位置设置DIV层的层叠样式表，再将所述DIV层插入到当前页面中。

所述的播放视频时加载字幕文件的系统，其中，字幕显示模块具体包括：

时间匹配单元，用于每隔预定时间获取当前播放时间信息，并与时间数组里的时间信息匹配；

标识获取单元，用于获取相匹配的时间数组的标识；

文字显示单元，用于根据所述标识读取并显示文字数组中对应的文字信息。

有益效果：本发明实现了在WEB平台通过浏览器播放视频时也能加载外挂字幕的功能，可更灵活的编辑字幕内容，实现字幕和视频分离的目的，本发明兼容HBBTV OBJECT对象和HTML5 VIDEO对象播放视频时，加载并显示字幕。

附图说明

图1为本发明一种播放视频时加载字幕文件的方法较佳实施例的流程图；

图2为本发明一种播放视频时加载字幕文件的系统较佳实施例的结构框图。

具体实施方式

本发明提供一种播放视频时加载字幕文件的方法及系统，为使本发明的目的、技术方案及效果更加清楚、明确，以下对本发明进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

请参阅图1，图1为本发明一种播放视频时加载字幕文件的方法较佳实施例的流程图，如图所示，其包括步骤：

S1、在WEB平台通过浏览器播放视频时，根据播放标签获取当前页面的播放对象；

S2、调用用于显示字幕的函数，加载并解析字幕文件，将其中各时间段的时间信息和对应的文字信息分别放入到时间数组和文字数组中；

S3、获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息。

本发明是基于JQuery框架，所以需引用JQuery.js。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

在步骤S1中，由于HTML5 VIDEO和HBBTV OBJECT对象分别有着不同的属性、方法和事件，所以加载字幕的兼容处理第一步便是页面加载完成后，获取当前页面的播放对象类型。

具体来说，根据播放标签获取当前页面的播放对象的步骤具体包括：

若当前页面采用HTML5 VIDEO标签，则设置播放对象为HTML5 VIDEO对象；

若当前页面采用HBBTV OBJECT标签，则设置播放对象为HBBTV OBJECT对象。

也即，若当前页面采用HTML5 VIDEO标签播放视频，则设置播放对象为HTML5 VIDEO对象；若当前页面采用HBBTV OBJECT标签播放视频，则设置播放对象为HBBTV OBJECT对象。

进一步，获取当前页面的播放对象之后还包括：

根据播放对象的属性值判断是否有设置字幕路径，若有则调用用于显示字幕的函数，若否则流程结束。

具体地，假如播放对象为HTML5 VIDEO对象，那么需要获取自定义属性data-subtitle的值，通过该值来判断是否有设置字幕路径；假如播放对象为HBBTV OBJECT对象，那么需要获取子标签track的属性src的值，通过该值来判断播放对象是否有设置字幕路径。若有设置字幕路径，那么调用用于显示字幕的函数，以便后续显示字幕。

如果当前播放对象没有设置字幕路径，则不启用字幕加载技术，那么流程结束。

进一步，在步骤S2中，调用用于显示字幕的函数的步骤具体包括：

判断是否存在用于显示字幕的函数，若存在，则直接调用所述函数；若不存在，则用创建一个DIV层，根据当前页面的位置设置DIV层的层叠样式表，再将所述DIV层插入到当前页面中。

也就是说，如果用于显示字幕的函数已经存在，则不用创建。

而如果用于显示字幕的函数不存在，则用document.createElement(‘div’)创建一个DIV层，根据当前页面的位置设置好显示字幕的css样式（层叠样式表），然后将这个DIV层插入到当前页面（body中）。DIV是一个块级元素，DIV的内容自动地开始一个新行，换行是 <div> 固有的唯一格式表现，可以通过 <div> 的 class 或 id 应用额外的样式。

然后使用AJAX技术异步请求加载字幕文件（如SRT文件），解析得到的responseText数据，将每个时间段的时间和对应的文字分别放入到时间数组和文字数组中。其中，AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。

进一步，在步骤S3中，获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息的步骤具体包括：

每隔预定时间获取当前播放时间信息，并与时间数组里的时间信息匹配；

获取相匹配的时间数组的标识；

根据所述标识读取并显示文字数组中对应的文字信息。

具体地，使用setInterval函数每隔预定时间（如1秒）不断去获取当前播放时间信息，并与时间数组里的时间信息匹配，获得相匹配的时间数组的标识（如下标），用这个下标读取文字数组里对应的文字信息，并根据时长显示文字信息，从而达到同步显示字幕的目的。

基于上述方法，本发明还提供一种播放视频时加载字幕文件的系统较佳实施例，如图2所示，其包括：

播放对象获取模块100，用于在WEB平台通过浏览器播放视频时，根据播放标签获取当前页面的播放对象；

字幕加载模块200，用于调用用于显示字幕的函数，加载并解析字幕文件，将其中各时间段的时间信息和对应的文字信息分别放入到时间数组和文字数组中；

字幕显示模块300，用于获取当前播放时间信息，并与时间数组里的时间信息匹配，根据匹配结果读取并显示文字数组中对应的文字信息。

进一步，所述播放对象获取模块100具体包括：

第一设置单元，用于若当前页面采用HTML5 VIDEO标签，则设置播放对象为HTML5 VIDEO对象；

第二设置单元，若当前页面采用HBBTV OBJECT标签，则设置播放对象为HBBTV OBJECT对象。

进一步，系统还包括：

字幕路径判断模块，用于根据播放对象的属性值判断是否有设置字幕路径，若有则调用用于显示字幕的函数，若否则流程结束。

进一步，字幕加载模块200具体包括：

函数判断单元，用于判断是否存在用于显示字幕的函数；

直接调用单元，用于若存在用于显示字幕的函数，则直接调用所述函数；

函数创建单元，用于若不存在用于显示字幕的函数，则用创建一个DIV层，根据当前页面的位置设置DIV层的层叠样式表，再将所述DIV层插入到当前页面中。

进一步，字幕显示模块300具体包括：

时间匹配单元，用于每隔预定时间获取当前播放时间信息，并与时间数组里的时间信息匹配；

标识获取单元，用于获取相匹配的时间数组的标识；

文字显示单元，用于根据所述标识读取并显示文字数组中对应的文字信息。

关于上述模块单元的技术细节在前面的方法中已有详述，故不再赘述。

综上所述，本发明实现了在WEB平台通过浏览器播放视频时也能加载外挂字幕的功能，可更灵活的编辑字幕内容，实现字幕和视频分离的目的，本发明兼容HBBTV OBJECT对象和HTML5 VIDEO对象播放视频时，加载并显示字幕。

应当理解的是，本发明的应用不限于上述的举例，对本领域普通技术人员来说，可以根据上述说明加以改进或变换，所有这些改进和变换都应属于本发明所附权利要求的保护范围。