## 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)  
```

3. 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.  

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

5. muted video 不会触发 `captureStream()`  

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