首页   注册   登录
 BlackHole1 最近的时间轴更新

BlackHole1

  •   Alo7
    V2EX 第 190356 号会员,加入于 2016-09-04 17:21:14 +08:00
    今日活跃度排名 2372
    BlackHole1 最近回复了
    @viakiba 这个不能在服务器上录制,而且必须要用户手动确定才可以
    @Rico 写了一篇文章来大概介绍一些原理,有兴趣可以看看: https://www.notion.so/5bda1e4a12c5478baabfd04de965b6f8
    @rizon 提出的问题很棒。我这里逐一回答下。
    1. 这个录制的基本实现原理
    在服务器上启动一个 chrome 浏览器,并且使用 xvfb 进行虚拟桌面。只所以使用 xvfb 虚拟出一个桌面,是因为项目中使用了 chrome 插件,而 chrome 目前不支持在 headless 模式下注入插件,所以 chrome 启动也不是 headless 模式。启动 chrome 后,同时也会为启动的 chrome 注入一个插件,这个插件会和服务端启动的 server 进行一个通信,打开要录制的网站,并在网站里植入一些 api(start、pause、resume、stop、fail、setExtraInfo)。当网站本身调用了 start 接口开始录制时,会通知到 chrome 插件,插件会调用 chrome extension 插件 api(chrome.tabCapture.capture)。但是这个 api 会有一个需要用户确认的操作,所以我当时翻了下相关的 chrome 的源码。找到了--whitelisted-extension-id 参数,可以绕过。从而达成自动化,但是因为这个 chrome 启动参数需要一个固定的 chrome 插件 id,所以就自己生成了一个 key,来保证 id 固定。整理大致流程就是这样,但是里面的细节非常多,所以后面我会写篇文章进行一个分析、疏通。

    2. 是在服务端同步了客户端的所有操作行为,然后服务端进行录制?
    是的

    3. 那比如在网页播放视频的时候怎么保证服务端和客户端的视频播放进度一致的?
    这个问题其实是一个难点,当时要录制的网站是由我的 leader 写的,据我所知,他使用了一个 timingsrc 项目来做相关同步的( https://webtiming.github.io/timingsrc/index.html)。而且我们其实不会说必须 100%和客户端同步,我们客户端每个用户操作其实都会触发一个信令,这个信令数据包含了用户的操作、时间等,在准备录制的时候,后端会基于信令数据生成相关的 json 数据,将要录制的网站就是根据这个 json 数据进行回放操作的,而因为我们是多个视频流(老师、多个学生),多个视频流同步就是我刚刚提到的 timingsrc 项目。

    4. 这个同时只能录制一个客户端么?
    其实是支持多个的,我在设计之初其实就是设计成了一个 chrome 录制多个客户端,其实就是打开多个 tab 页,而且 A Tab 页的声音不会影响 B Tab 页的声音。只不过这种设计不够“最小集”,而且这样对一个 docker(k8s 里为 pod)。占用的资源太大,不利于后面的管理。所以就砍掉了。

    5. 这个 docker 镜像是做什么用的?是个演示用的 还是服务端?
    其实都可以,做成 docker 是因为这个是为了方便演示,以及有人使用 k8s 进行集群部署时方便一点

    6. docker 提供了两个接口,一个是 unbuntu 的 vnc 端口?一个 chrome 的 debug 端口?
    是的,这里应该改为 提供了两个端口

    7. 然后你在本地的 chrome 打开远程 debug,调试 docker 中的 Chrome 页面,然后本地执行 rebirth 的 录制命令,然后服务器就会录制。。但是好懵逼。。。实际的应用中是怎么个流程呢?
    我在演示时只所以这么做有两个原因。1: 当时我不能对我要录制的网站有完整可控权; 2: 我想演示下 vnc 和 remote debug 的连接方式。之所以没有可控权,是因为我无权更改网站代码,所以我不能再网站里写上:“准确就绪后调用 start 接口,等 20 秒调用 stop 接口”。所以你可以看下 https://github.com/alo7/rebirth/tree/master/examples/webm2mp4。这个例子中,录制的是 https://www.bugs.cc/self_page/github/rebirth/webm2mp4/这个网站,而这个网站我写了一个定时器,网站打开后一秒钟开始录制,5 分钟后完成录制。

    8. 怎么把你的这个东西安装到我们的服务里来?怎么去部署??服务器录制是服务器自动化的操作还是需要谁去触发?
    我们公司使用的是 k8s 部署方案,所以 docker 其实就是部署在 k8s 上的 pod 而已。我们公司是这节课上完后,server 把信令转化成 json 格式后,往数据库里插入一条数据。而我写了另一个项目,这个项目就是会定时 3 分钟去扫这个数据,一旦发现有新的录制任务,则会调用 k8s 的 api,启动一个 Job->Pod。来进行录制。并自动回收,因为这个项目代码简单,而且不太方面开源,就没有放出来,可以看下我之前针对这个项目写的文章:基于任务量进行 k8s 集群的灵活调度处理( https://juejin.im/post/5d5ba474f265da03b638aee1)
    @jobtesting @herozhang 这点可以放心,在开源之前已经得到了公司的授权,代码也经过了公司的 TC 委员会代码 review。没有问题后才进行开源的。并且开源所属账号是公司名下,且 docker images 管理账号也是公司名下的
    @richard1122 看起来是很像,但是实现原理不同,这个貌似无法录制声音、刷新、跳转
    @Orenoid README 我实在不知道应该怎么写了...较劲脑汁写成这样了...

    以及那个 Dockerfile,是因为如果一次性安装过多时,有很大的几率会 build fail(至今想不明白...)
    @wudalang123 把 README 上针对我们公司的应用场景介绍搬过来:

    我们是一个在线教育的公司。在实际业务场景中有一个需求是把上课过程录制下来,并进行 AI 分析,生成本节课的精彩视频,供学生及老师查看。

    因为我们的应用是 Electron 开发的,所以一开始我们使用的是在老师端启动一个屏幕录制,把上课过程录制下来,但是这样做有一个缺点,就是严重依赖了老师的电脑设备及网络带宽,导致我们公司在招聘老师的过程中,电脑性能也是一个非常重要的考察目标。

    为了招聘到更多优秀的老师,避免因为非老师自身问题导致的没有招聘,所带来的影响。从而我们研发出 Rebirth 项目。

    我们的做法是把上课页面完整的复制一份(这里称作 replay),同时在上课过程中,记录下学生和老师的动作行为(鼠标移动、鼠标点击、键盘打字、课件翻页、老师及学生摄像头的画面等),再根据这些动作行为数据,在 replay 里进行一次复现,在复现过程中由 Rebirth 进行录制。从而达到降低老师设备及网络带宽的要求,而且我们一节课可以为公司节省 6~8 元人民币的开销,因为之前屏幕录制使用的是第三方服务。
    @superbai 不需要的。这个项目是在服务端进行录制的,如果有用户授权的行为,那其实是做不了自动化的。所以后来通过对 chrome 增加--whitelisted-extension-id 启动参数,来绕过了这个限制
    @dreamerlv3ex 是可以的,但是这个项目核心是录制。除非爬虫的时候有录制需求,不然的话我还是推荐直接用 Puppeteer

    @superbai 是的,当然也可以忽略用户的操作,只录制网页的变化
    @dreamerlv3ex 是录制 chrome 下的 tab 页。tab 页内的网站任何变化都能录制下来(跳转、刷新、声音等)
    关于   ·   FAQ   ·   API   ·   我们的愿景   ·   广告投放   ·   感谢   ·   实用小工具   ·   4386 人在线   最高记录 5043   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.3 · 13ms · UTC 01:49 · PVG 09:49 · LAX 17:49 · JFK 20:49
    ♥ Do have faith in what you're doing.