[发明专利]一种基于HTML5的不同帧率音视频的同步方法及装置

说明书

本发明提供了一种基于HTML5的不同帧率音视频同步方法及装置，其中的方法包括：从服务端接收视频流和音频流；基于采样率对音频流中包含的音频帧数据按照固定时长进行播放；实时监测视频帧帧率，以音频帧数据的播放时长为基准，调整每帧视频数据的播放时长，实现不同帧率音视频的同步。本发明提供的方法中，视频帧可以以音频帧时间轴为参考，实现视音频同步播放。

技术领域

本发明涉及音视频处理技术领域，具体涉及一种基于HTML5的不同帧率音视频的同步方法及装置。

背景技术

在HTML5标准出现以前，浏览器上实现实时音视频流的播放，一般都采用自定义开发插件或flashplayer插件的方式。自定义开发插件需要针对不同的浏览器开发不同的插件版本，IE使用ActiveX架构开发，NPAPI架构浏览器(firefox、chrome、Safari)需采用NPAPI架构开发，费时费力。采用flash插件方案，虽然解决了跨浏览器问题，但flash插件是个封闭保护插件，开放的接口有限，同时其音视频流格式也是其专有的，必须使用专有的后台服务，导致其可扩展性十分有限，难于在实时流直播中大量应用。同时，以上两种方案，均需要在浏览器中进行插件安装，因浏览器的安全等级保护导致用户使用起来很不方便。

HTML5是Web标准最巨大的飞跃。HTML5并非仅仅用来表示Web内容，它也将Web带入一个成熟的应用平台，在这个平台上，视频，音频，动画等都被标准化。随着HTML5的发展，各个浏览器都已经支持HTML5。HTML5提供了音频视频的标准接口，实现了无需任何插件支持，只需浏览器支持相应的HTML5标签，从而免除Flash等插件的安装直接播放音视频。Video标签虽然免除了插件安装，但目前支持的格式是有限制的，为以下三种格式：Ogg、MPEG4、WebM。考虑到最多种浏览器支持，大多选用MPEG4，其编码格式为H.264视频编码和AAC音频编码，Internet Explorer 9+,Firefox,Opera,Chrome以及Safari均支持Video标签。在以上浏览器中，都可以采用Video标签来播放MP4文件，仅仅需要指定要播放的视频的URL地址即可。

本发明申请人在实施本发明的过程中，发现现有技术中至少存在如下技术问题：

现有技术中video标签播放视频主要有两种方式，一种是播放本地文件的方式，一种是播放服务端文件流的方式，但是目前在这两种方式中，Video只能支持某种固定参数的MP4文件，对逐帧实时采集上传的音视频帧流数据并不支持，音频、视频按各自轨道数据进行播放，不能进行音视频同步性控制播放。

由此可知，现有技术中的方法存在无法实现音视频同步的技术问题。

发明内容

有鉴于此，本发明实施例提供了一种基于HTML5的不同帧率音视频的同步方法及装置，用以解决或者至少解决现有技术中的方法存在的无法实现音视频同步的技术问题。

为了解决上述技术问题，本发明第一方面提供了一种基于HTML5的不同帧率音视频的同步方法，所述方法包括：

从服务端接收视频流和音频流；

基于采样率对音频流中包含的音频帧数据按照固定时长进行播放；

实时监测视频帧帧率，以音频帧数据的播放时长为基准，调整每帧视频数据的播放时长，实现不同帧率音视频的同步。

在一种实施方式中，从服务端接收视频流和音频流，包括：

采用websocket从服务端接收h264视频流和aac音频流。

在一种实施方式中，基于采样率对音频流中包含的音频帧数据按照固定时长进行播放，包括：

基于预设封装规则对接收的视频流和音频流分视轨音轨进行封装，设置音频帧的封装参数，对音频流中包含的音频帧数据按照固定时长进行播放。