zooble / video-recorder

README.md 2.48 KB

video 视频录制

使用方法：

打开chrome浏览器，在地址栏输入chrome://extensions/，打开后点击加载已解压的扩展程序，选择本项目目录即可安装成功。

TODO:

  1. 同个页面多个 video 处理
  2. 视频暂停时要暂停录制
  3. popup 增加录制提示，各种控制按钮，如静音录制、自动录制等等
  4. 在 client 端转为 MP4 格式的可行性
  5. 经常会失败，或录制不全
  6. 顶多可以同时开3个窗口录制，再多容易失败

问题记录

  1. 很多视频网站播放完后会刷新页面到下一个播放页面，导致 content.js 中对 video 标签的 end complete 事件的监听函数中的动作不能保证成功，同样页面的 beforeunload unload 事件监听函数中的动作也不能保证成功

  2. MediaRecorder 只能录制以下几种格式的视频： 

Essentially, it looks like the following are (at time of writing) accepted MIME types for video/audio in Chrome:

video/webm
video/webm;codecs=vp8
video/webm;codecs=vp9
video/webm;codecs=vp8.0
video/webm;codecs=vp9.0
video/webm;codecs=h264
video/webm;codecs=H264
video/webm;codecs=avc1
video/webm;codecs=vp8,opus
video/WEBM;codecs=VP8,OPUS
video/webm;codecs=vp9,opus
video/webm;codecs=vp8,vp9,opus
video/webm;codecs=h264,opus
video/webm;codecs=h264,vp9,opus
video/x-matroska;codecs=avc1

audio/webm

audio/webm;codecs=opus
(EDITED 2019-02-10: Updated to include brianchirls' link find)
  1. https://github.com/ffmpegwasm/ffmpeg.wasm 不能用于浏览器插件的 background, 报错：

Uncaught (in promise) RuntimeError: abort(CompileError: WebAssembly.instantiate(): Wasm code generation disallowed by embedder). Build with -s ASSERTIONS=1 for more info.

manifest.json 加上 "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'", 仍然报错：

Refused to load the script 'blob:chrome-extension://nnodhmmdmobflnhbigcheclnhdfkidpf/71e2d139-c5f1-4991-bbc0-4748802aec2a' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

  1. content 和 background 通信无法直接传递 Blob 类型数据，但可以传递 URL.createObjectURL 创建的数据，localStorage 同样。可以使用 new FileReader().readAsBinaryString 解决

  2. muted video 不会触发 captureStream()

https://bugs.chromium.org/p/chromium/issues/detail?id=1136404