CN116320587B - 一种基于h5多播放器实现短视频加速的方法及装置 - Google Patents

Abstract

本发明提供一种基于H5多播放器实现短视频加速的方法及装置，属于短视频加速技术领域，所述方法步骤如下：基于H5框架搭建web播放器客户端和服务端，并在客户端设置视频缓存队列和播放器队列；客户端向服务端获取分段的视频流播放信息，并通过视频缓存队列缓存；客户端通过播放器队列根据缓存的视频流播放信息向服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；客户端接收用户对短视频页面的滑动指令，使用前一播放器播放已加载视频流，而使用后一播放器播放预加载视频流。本发明实现轻量化短视频播放功能，保证短视频播放流畅度，实现应用灵活发布，满足企业级短视频播放功能。

Description

一种基于H5多播放器实现短视频加速的方法及装置

技术领域

本发明属于短视频加速技术领域，具体涉及一种基于H5多播放器实现短视频加速的方法及装置。

背景技术

随着短视频的发展，企业级移动应用中也有了短视频需求，但当下的主要短视频平台例如抖音、快手等短视频应用的平台存在功能冗余，不适用于传统的企业级移动综合类门户中短视频功能需求，企业级移动应用中短视频功能不需要提供诸如抖音、快手等短视频平台的用户个性化虚拟能力，只需满足播放基础功能和流畅播放能力即可。而作为大部分短视频框架技术所采用的原生播放器虽然具备强大的播放能力，但对于综合类移动门户而言并不适用，需要在安卓、iOS端提供的原生播放sdk包基础上根据机型进行短视频播放器进一步的扩展和开发。

目前现有主流的短视频技术方案为针对安卓和iOS的原生播放器方案。原生播放器基于原生sdk具备加速缓存能力，但是原生加速器需要集成sdk，导致原生的安装包较大，此外还需要综合iOS端与安卓端以及各个系统版本进行考虑，无论是开发成本还是难度都较大，对于部分需经常更新的移动应用，原生功能需要频繁整包更新，从而导致用户过多的流量浪费，甚至有些sdk的冗余仅仅是只为了非必须的功能，却导致降低了用户的体验。

综上，现有短视频原生方案所需依赖包过大，开发成本过高，安装包体积过大，并且无法适配移动设备中网络不稳定环境下的播放流畅度。

此为现有技术的不足，因此，针对现有技术中的上述缺陷，提供一种基于H5多播放器实现短视频加速的方法及装置，是非常有必要的。

发明内容

针对现有技术的上述现有短视频原生方案所需依赖包过大，开发成本过高，安装包体积过大，并且无法适配移动设备中网络不稳定环境下的播放流畅度的缺陷，本发明提供一种基于H5多播放器实现短视频加速的方法及装置，以解决上述技术问题。

第一方面，本发明提供一种基于H5多播放器实现短视频加速的方法，包括如下步骤：

S1.基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；

S2.web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；

S3.web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；

S4.web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流。

进一步地，步骤S1具体步骤如下：

S11.基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

S12.将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；

S13.基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；

S14.在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；

S15.在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系。

进一步地，步骤S12中目标播放格式为m3u8播放格式；

步骤S14中目标播放器格式地址为m3u8地址，播放器属性信息包括宽和高属性信息，播放功能包括播放、暂停以及继续播放。

进一步地，步骤S2具体步骤如下：

S21.web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

S22.web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

S23.web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

S24.web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用。

进一步地，视频流播放信息还包括视频流令牌。

进一步地，步骤S3具体步骤如下：

S31.web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；

S32.web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

S33.web播放器客户端播放器队列的N个播放器循环作为当前播放器；

S34.web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器。

进一步地，步骤S33中在当前播放器的视频流播放完毕后，则令下一播放器作为当前播放器，而令最上端的播放器作为新的末端播放器继续通过视频缓存队列向web播放器服务器请求视频流地址，进行视频流预加载。

进一步地，步骤S4具体步骤如下：

S41.短视频播放过程中，web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

当滑动操作指令为下滑操作时，进入步骤S42；

当滑动操作指令为上滑操作时，进入步骤S43；

S42.web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放，结束；

S43.web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放。

第二方面，本发明提供一种基于H5多播放器实现短视频加速的装置，包括：

web播放器客户端及服务端搭建模块，用于基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；

视频流播放信息缓存模块，用于在web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；

视频流预加载模块，用于在web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；

视频滑动播放处理模块，用于在web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流。

进一步地，web播放器客户端及服务端搭建模块包括：

服务端搭建及短视频存储单元，用于基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

短视频切割单元，用于将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；

视频缓存队列设置单元，用于基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；

播放器初始化单元，用于在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；

播放器队列设置单元，用于在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系；

视频流播放信息缓存模块包括：

分页视频列表获取单元，用于在web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

视频缓存队列长度确定单元，用于在web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

视频流地址获取单元，用于在web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

视频流地址缓存单元，用于在web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用。

进一步地，视频流预加载模块包括：

视频流请求单元，用于在web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；

视频流加载单元，用于在web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

播放器循环单元，用于在web播放器客户端播放器队列的N个播放器循环作为当前播放器；

播放器隐藏单元，用于在web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器；

视频滑动播放处理模块包括：

滑动操作指令解析单元，用于短视频播放过程中，在web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

前一视频再播放单元，用于滑动操作指令为下滑操作时，在web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放；

预加载视频播放单元，用于滑动操作指令为上滑操作时，web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放。

本发明的有益效果在于：

本发明提供的基于H5多播放器实现短视频加速的方法及装置，基于H5技术实现了短视频播放功能的轻量化，摒弃了大量和短视频播放无关的功能，通过多播放器设计，解决了传统H5单播放器缺乏预加载能力导致视频流不流畅、体验差的问题，使应用具备与原生播放器同等流畅度的同时，又可通过H5的方式实现灵活的应用发布，更适应企业级短视频播放功能的需求场景。

此外，本发明设计原理可靠，结构简单，具有非常广泛的应用前景。

由此可见，本发明与现有技术相比，具有突出的实质性特点和显著的进步，其实施的有益效果也是显而易见的。

附图说明

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

图1是本发明基于H5多播放器实现短视频加速的方法实施例1流程示意图。

图2是本发明基于H5多播放器实现短视频加速的方法实施例2流程示意图。

图3为本发明基于H5多播放器实现短视频加速的装置示意图。

具体实施方式

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

H5，指的是HTML5,即网页使用的HTML代码-第五代超文本标记语言；狭义上，H5就是互动形式的多媒体广告页面。

实施例1：

如图1所示，本发明提供一种基于H5多播放器实现短视频加速的方法，包括如下步骤：

S1.基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；

S2.web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；

S3.web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；

S4.web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流。

实施例2：

如图2所示，本发明提供一种基于H5多播放器实现短视频加速的方法，包括如下步骤：

S1.基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；步骤S1具体步骤如下：

S11.基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

S12.将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；目标播放格式为m3u8播放格式；

S13.基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；初始化获取视频缓存队列，移动应用从web播放器服务端中获取用户所需的视频播放地址及其他参数并存入缓存队列，以播放队列长度为三个为例，加载队列中的前三个视频流对应到三个全局播放器中；

S14.在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；目标播放器格式地址为m3u8地址，播放器属性信息包括宽和高属性信息，播放功能包括播放、暂停以及继续播放；进行播放器的初始化，将H5西瓜播放器，基于vue框架进行播放器组件的应用层封装，每个组件中配置m3u8地址、播放器的宽高等属性，并实现播放、暂停、继续播放等播放操作功能；

S15.在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系；通过设计若干全局播放器，以三个为例，并制定合理的切换策略，为后续基于多播放器的短视频播放和平滑切换功能做好准备；

S2.web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；视频流播放信息还包括视频流令牌；步骤S2具体步骤如下：

S21.web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

S22.web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

S23.web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

S24.web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用；

S3.web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；步骤S3具体步骤如下：

S31.web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；进行视频流信息预加载处理，当用户通过服务接口成功获取首个视频播放地址后，组件通过异步方式，自动根据队列中下一个视频vid获取该视频的token、宽高尺寸、码率、m3u8地址等信息，并存入视频缓存队列中，供下一个播放器使用；

S32.web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

S33.web播放器客户端播放器队列的N个播放器循环作为当前播放器；

S34.web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器；应用多播放器预加载机制，当用户初始化首个播放器并触发可播放事件时，根据上一步中视频缓存队列提供的参数，对下一个播放器进行初始化，并通过灵活设置该播放器的CSS样式为隐藏且暂停播放状态，实现提前后台加载播放器且不干扰用户当前播放；

S4.web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流；步骤S4具体步骤如下：

S41.短视频播放过程中，web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

当滑动操作指令为下滑操作时，进入步骤S42；

当滑动操作指令为上滑操作时，进入步骤S43；

S42.web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放，结束；

S43.web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放；

当用户对视频页面进行滑动操作的时候，组件判断滑动方向，并根据滑动方向进行播放器和视频流的移位处理：如果是下滑操作即往回播放，由于上一个播放器已加载视频流并播放过，可直接切换上一个播放器进行播放，不再需要重新进行视频流信息预加载和多播放器预加载；如果是上滑操作即播放队列中的下一个视频，需要切换至下一个播放器将其显示并启动播放，同时将上一个播放器隐藏并暂停播放，借助开启新的视频流和播放器预加载流程。

在某些实施例中，步骤S33中在当前播放器的视频流播放完毕后，则令下一播放器作为当前播放器，而令最上端的播放器作为新的末端播放器继续通过视频缓存队列向web播放器服务器请求视频流地址，进行视频流预加载。

实施例3：

如图3所示，本发明提供一种基于H5多播放器实现短视频加速的装置，包括：

web播放器客户端及服务端搭建模块，用于基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；web播放器客户端及服务端搭建模块包括：

服务端搭建及短视频存储单元，用于基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

短视频切割单元，用于将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；

视频缓存队列设置单元，用于基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；

播放器初始化单元，用于在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；

播放器队列设置单元，用于在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系；

视频流播放信息缓存模块，用于在web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；视频流播放信息缓存模块包括：

分页视频列表获取单元，用于在web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

视频缓存队列长度确定单元，用于在web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

视频流地址获取单元，用于在web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

视频流地址缓存单元，用于在web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用；

视频流预加载模块，用于在web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；视频流预加载模块包括：

视频流请求单元，用于在web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；

视频流加载单元，用于在web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

播放器循环单元，用于在web播放器客户端播放器队列的N个播放器循环作为当前播放器；

播放器隐藏单元，用于在web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器；

视频滑动播放处理模块，用于在web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流；视频滑动播放处理模块包括：

滑动操作指令解析单元，用于短视频播放过程中，在web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

前一视频再播放单元，用于滑动操作指令为下滑操作时，在web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放；

预加载视频播放单元，用于滑动操作指令为上滑操作时，web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放。

尽管通过参考附图并结合优选实施例的方式对本发明进行了详细描述，但本发明并不限于此。在不脱离本发明的精神和实质的前提下，本领域普通技术人员可以对本发明的实施例进行各种等效的修改或替换，而这些修改或替换都应在本发明的涵盖范围内/任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以所述权利要求的保护范围为准。

Claims (4)

1.一种基于H5多播放器实现短视频加速的方法，其特征在于，包括如下步骤：

S1.基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；步骤S1具体步骤如下：

S11.基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

S12.将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；

S13.基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；

S14.在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；

S15.在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系；

S2.web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；步骤S2具体步骤如下：

S21.web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

S22.web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

S23.web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

S24.web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用；

S3.web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；步骤S3具体步骤如下：

S31.web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；

S32.web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

S33.web播放器客户端播放器队列的N个播放器循环作为当前播放器；

S34.web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器；

S4.web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流；步骤S4具体步骤如下：

S41.短视频播放过程中，web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

当滑动操作指令为下滑操作时，进入步骤S42；

当滑动操作指令为上滑操作时，进入步骤S43；

S42.web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放，结束；

S43.web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放。

2.如权利要求1所述的基于H5多播放器实现短视频加速的方法，其特征在于，步骤S12中目标播放格式为m3u8播放格式；

步骤S14中目标播放器格式地址为m3u8地址，播放器属性信息包括宽和高属性信息，播放功能包括播放、暂停以及继续播放。

3.如权利要求1所述的基于H5多播放器实现短视频加速的方法，其特征在于，步骤S33中在当前播放器的视频流播放完毕后，则令下一播放器作为当前播放器，而令最上端的播放器作为新的末端播放器继续通过视频缓存队列向web播放器服务器请求视频流地址，进行视频流预加载。

4.一种基于H5多播放器实现短视频加速的装置，其特征在于，包括：

web播放器客户端及服务端搭建模块，用于基于H5框架搭建web播放器客户端和服务端，并在web播放器客户端设置视频缓存队列进行多视频流初始化，以及设置播放器队列进行多播放器初始化；web播放器客户端及服务端搭建模块包括：

服务端搭建及短视频存储单元，用于基于H5框架搭建web播放器服务端，并在web播放器服务端存储短视频；

短视频切割单元，用于将web播放器服务端存储的短视频按照目标播放格式切割为若干ts格式的流媒体片段，生成连续的若干视频流；

视频缓存队列设置单元，用于基于H5框架搭建web播放器客户端，在web播放器客户端设置视频缓存队列，且视频缓存队列长度大于等于播放器队列长度；

播放器初始化单元，用于在web播放器客户端进行播放器初始化，基于vue框架进行播放器组件应用层封装，并在每个组件中配置目标播放格式地址、播放器属性信息，以及集成播放功能；

播放器队列设置单元，用于在web播放器客户端设置播放器队列，并在播放器队列中放置至少三个全局H5播放器，并按照播放器顺序建立各播放器与视频缓存队列的一一对应关系；视频流播放信息缓存模块，用于在web播放器客户端接收到用户触发的播放事件后，向web播放器服务端获取分段的视频流播放信息，再通过视频缓存队列对分段的视频流播放信息进行缓存；视频流播放信息缓存模块包括：

分页视频列表获取单元，用于在web播放器客户端接收到用户触发的短视频播放事件后，向web服务器服务端获取分页视频列表；

视频缓存队列长度确定单元，用于在web播放器客户端根据播放队列长度确定视频缓存队列的使用长度；

视频流地址获取单元，用于在web播放器客户端根据分页视频列表通过异步方式向web播放器服务端获取连续的N段视频流播放地址；N的数量与播放队列长度相等；

视频流地址缓存单元，用于在web播放器客户端将获取N端视频流播放地址保存在视频缓存队列中，提供给播放器队列使用；

视频流预加载模块，用于在web播放器客户端通过播放器队列向视频缓存队列获取分段的视频流播放信息，再向web播放器服务端请求分段的视频流，使用当前播放器对当前视频流进行播放，而使用下一播放器对下一视频流进行预加载；视频流预加载模块包括：

视频流请求单元，用于在web播放器客户端通过播放器队列向视频缓存队列获取N段视频流播放地址，并根据视频流播放地址向web播放器服务端请求N段连续视频流；

视频流加载单元，用于在web播放器客户端播放器队列的N个播放器与N段连续视频流一一对应进行加载；

播放器循环单元，用于在web播放器客户端播放器队列的N个播放器循环作为当前播放器；

播放器隐藏单元，用于在web播放器客户端播放器队列的当前播放器播放加载视频流，而当前播放器的前一播放器及后一播放器暂停播放视频流，并隐藏播放器；

视频滑动播放处理模块，用于在web播放器客户端接收用户对短视频页面的滑动指令，并在下滑操作时使用前一播放器播放已加载视频流，而在上滑操作时使用后一播放器播放预加载视频流；视频滑动播放处理模块包括：

滑动操作指令解析单元，用于短视频播放过程中，在web播放器客户端接收到用户对短视频页面的滑动操作指令时，对指令进行解析；

前一视频再播放单元，用于滑动操作指令为下滑操作时，在web播放器客户端切换前一播放器作为当前播放器，对已加载视频流进行播放，并对当前播放器隐藏，并暂停播放；

预加载视频播放单元，用于滑动操作指令为上滑操作时，web播放器客户端切换后一播放器作为当前播放器，对预加载视频进行播放，并对当前播放器隐藏，并暂停播放。