Webm进度条问题分析与解决

介绍

当我们使用getUserMediaMediaRecorder等API生成的webm视频时,会发现最终的webm是无法拖动进度条的。除非使用FFmpeg把webm转成其他格式的视频文件,或者等webm视频播放完后,就可以拖动了。

分析

经过几个小时的排查,发现并不是MediaRecorder使用有问题,因为在网上找的其他demo生成的webm也都不行。

一开始把分析点放在了进度条那里,结果在网上没有搜到任何相关文章,尝试了各种关键词都不行。

后来想到,可以使用FFmpeg来对视频文件进行分析。于是使用ffprobe rebirth-demo.webm命令进行分析:

通过Webkit远程调试协议监听网页崩溃.

背景介绍

因为正在开发一个项目,而这个项目使用到了puppeteer,其中有个功能是在puppeteer打开的chrome里打开多个Tab,并进行管理。
虽然puppeteer可以打开多个网站,但是并不利于管理,所有我使用的是插件的方式,通过插件来打开多网站,并进行管理。

但是这里有个需求是,当网站崩溃时,我要做出一些操作。但是目前网上没有一个好的办法去监听当前网站是否崩溃。

可能有同学会说:puppeteer不是提供了一个page.on('error', fn)的方法,来进行监听么?

请注意上文中提到的,使用插件打开多个网站,puppeteer提供的方法只能对自己打开的网站起作用,没有使用puppeteer打开的网站,page.on('error', fn)方法无能为力。

使用Service Workers

这个方法是由我同事Haitao提出来的思路。

在当前网站上运行一个Service Workers,因为在运行的时候Service Workers会再启动一个单独的进程,当前网站和Service Workers是两个单独的进程。也就是说当网站崩溃时,并不影响Service Workers进程。所以可通过心跳检测来进行判断网站是否崩溃。

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×