/p>4、但是，这种动态字幕技术也存在不足：由于合成渲染程序与浏览器（cef）的交互是一个动态字幕对应一个浏览器进程，如果时间线cg轨动态字幕过多，浏览器进程的启动关闭次数也会变多，造成性能损失。如果是多轨动态字幕，会出现同时和多个浏览器进行交互获取图像，耗时成倍增加，一轨耗时10毫秒，两轨则耗时20毫秒左右，合成效率急剧下降。
技术实现思路
1、本专利技术的目的在于克服现有技术的缺点，提供的用于视频播放的基于浏览器的高效率渲染方法及其系统，解决视频播放技术中由于动态字幕过多导致合成渲染效率急剧下降的问题。
2、需要说明的是，在现有动态字幕中，由于常规渲染程序（常规渲染模块）与浏览器（cef）的交互是一个动态字幕对应一个浏览器进程，如果动态字幕过多就会导致有多个浏览器进程，这样常规渲染程序（常规渲染模块）和浏览器（cef）的交互也是多次，从而导致合成效率低下。
3、那么，考虑到现在的浏览器是支持多种图像格式的处理的，例如jpg\png\gif\webp等等，基本满足时间线里图像格式的支持，是否可以将cg轨内容全部剥离交给浏览器来处理（不仅剥离动态字幕，还剥离其他cg特效）；此外，还考虑到cg轨图像永远存在于v轨的上方。因此，本方案提出，将cg轨所有元素全交由浏览器渲染，一个时间线的合成只启动一个浏览器进程。只需要将从浏览器中取到的图像数据叠加到v轨的画面，再融合音频数据，即可生成视频。
4、本专利技术的目的通过以下技术方案来实现：
5、第一方面，公开了用于视频播放的基于浏览器的高效率渲染方法，包括以下步骤：
6、s1-当合成渲染模块接收到来自前端的播放请求时，判断视频中的时间线里的cg轨是否含有浏览器不支持的元素；若cg轨中的元素都能得到浏览器支持，则启动浏览器cef、并将cg轨传输给浏览器、准备进行cg轨的渲染工作，将视频中时间线里的a轨内容、v轨内容留在合成渲染模块进行后续处理；
7、s2-建立浏览器cef与合成渲染模块之间的通道，合成渲染模块通过该通道获知cg轨内容，从而创建主容器画布；然后通过该通道将cg轨渲染在主容器画布上，形成cg轨画布，该cg轨画布即为js时间线渲染器；此外，还建立js时间线渲染器与合成渲染模块中v轨处理后、a轨处理后的交互方式；
8、s21-在启动浏览器cef后，写入合成渲染模块中准备创建的js时间线渲染器所在的网页地址，建立浏览器cef与合成渲染模块中准备创建的js时间线渲染器之间的数据交互；
9、s22-创建js时间线渲染器：s221、当浏览器cef启动后，合成渲染程序会将视频中的时间线里的cg轨数据注入到window节点下，使得js时间线渲染器在创建时即可立即取到时间线里的cg轨数据，从而开始时间线渲染器的创建，开始js时间渲染器的创建；s222、通过javascript先解析时间线里的cg轨数据，获取时间线信息-即获取时间线轨道的高度和宽度，然后创建时间线所需大小的画布，该画布为主容器；s223、通过javascript再解析时间线里的cg轨数据，读取cg轨中所有切段元素，每个切段元素含有自己的入点和出点属性；针对每个切段元素创建相应的显示对象，每创建完一个显示对象便向主容器中添加一个；如此，便将cg轨按时间线在主容器画布上的完成渲染，形成cg轨画布，该cg轨画布即为js时间线渲染器；
10、s3-合成渲染程序生成成品视频；
11、对v轨进行渲染，得到v轨画布；
12、将cg画布与v轨画布进行叠加，得到某一时刻的最终画面；
13、将a轨与某一时刻的最终画面叠加，最终得到成品的视频文件。
14、进一步，所述的s1中，在读取视频的时间线，判断出cg轨中含有浏览器不支持的元素，则将cg轨不传递给浏览器处理、而是在常规渲染模块进行渲染处理。此处的常规渲染模块，是指在后端服务器中存在的另一个程序模块，该程序模块执行常见的渲染方式-即将cg轨、a轨、v轨直接进行渲染合成处理。
15、进一步，所述的s221中，当浏览器cef启动后，浏览器cef会将cg轨的时间线数据传递给合成渲染程序，然后合成渲染程序再将cg轨时间线数据注入到window节点下。当浏览器cef将cg轨的时间线数据传递给合成渲染程序时：将cg轨的所有待加载的内容做成队列，进行排队加载；并将加载的进度状态反馈给合成渲染模块；其中，加载的进度用从0%至100%的百分比表示，0%表示初始化状态、0%-100%之间表示正在初始化状态、100%表示初始化完成状态，此外，还有初始化错误状态。
16、对初始化错误状态进行说明：由于cg轨是图片或文字数据，需要通过网络加载图片资源或字体资源，可能会存在加载失败的问题，此时需要返回错误状态，让合成渲染模块重试或置为失败。
17、进一步，当cg轨的所有待加载内容均加载完毕后-即js时间线渲染器初始化完成后：分析并产生渲染范围数据：分析cg轨中不同类型的数据的入点、出点以及时间线总长度，将时间线所有点标记连续的渲染类型，具体类型分为动态区、静态区、空区，划分的区的时间范围即为渲染范围数据。分析并产生交互次数：在动态区中，根据不同时间点的不同画面的数量，则确定相应数量的交互次数；在静态区中，确定一次交互；在空区中，确定不产生交互。将渲染范围数据、交互次数均回调给合成渲染模块并记录。...
【技术保护点】
1.用于视频播放的基于浏览器的高效率渲染方法，其特征在于：包括以下步骤：
2.根据权利要求1所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：所述的S1中，在读取视频的时间线，判断出CG轨中含有浏览器不支持的元素，则CG轨不传递给浏览器处理、而是在常规渲染模块进行渲染处理。
3.根据权利要求1所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：所述的S221中，当浏览器CEF启动后，浏览器CEF会将CG轨的时间线数据传递给合成渲染程序，然后合成渲染程序再将CG轨时间线数据注入到window节点下；
4.根据权利要求3所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：当CG轨的所有待加载内容均加载完毕后-即JS时间线渲染器初始化完成后：
5.根据权利要求4所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：当渲染范围数据、交互次数均回调给合成渲染模块并记录后：
6.根据权利要求1~5任一项所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：在所述的S2中：
7.根据权利要求4或5所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：所述的渲染范围数据：
8.根据权利要求6所述的用于视频播放的基于浏览器的高效率渲染方法，其特征在于：所述S3中，具体地：
9.如权利要求1~8任一项所述用于视频播放的基于浏览器的高效率渲染方法的系统，其特征在于：包括后端的处理器、后端的视频存储器、前端的浏览器；
...
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。