VideoCapture

demo

请参考 /test/index.html

使用方式(API)

• getAllFramePicture(file, width, height) // 获取视频的所有帧图片 ==> Promise对象
  • file: file对象
  • width: 图片宽度
  • height: 图片高度
  • return {width, height, imageDataBuffer(Uint8ClampedArray对象)} ==> Promise对象
• getVideoFrameCount(file) // 获取视频文件有多少帧
• getVideoFramePictureByIndex(file, index, width, height) // 获取视频第index帧的图片
  • file: file对象
  • index: 第几帧
  • width: 图片宽度
  • height: 图片高度
  • return {width, height, imageDataBuffer(Uint8ClampedArray对象)} ==> Promise对象

ffmpeg+wasm 解析视频（docker镜像版）

参考

https://juejin.cn/post/6998876488451751973#heading-11 https://github.com/jordiwang/web-capture

系统环境

win10

下载docker for windows 下载地址

下载emscripten/emsdk 镜像

// 拉取镜像
docker pull emscripten/emsdk
// 创建docker实例, 下面的命令干了啥事?(将docker实例的名字设置为emcc； 在docker实例根目录下创建src文件夹并和windows系统的C:\test目录做关联--在windows的这个目录下的操作会同步到docker实例的src目录)
docker run -itd --name emcc -v C:\test:/src emscripten/emsdk

恭喜你: emcc命令可以使用了

开始自定义编译ffmpeg

下载ffmpeg

一定是4.4版本，其他版本不保证正常

编译ffmpeg

参考 /src/source/buildFFmpeg.sh

编译自己写的c/c++脚本

参考 /src/source/buildWasm.sh

注意

由于是windows平台编辑的.sh文件, 如果在linux上运行请下载 dos2unix 下载方式: sudo apt-get install dos2unix 如果下载失败或者其他报错请执行 sudo apt-get update 再次运行安装命令

// 使用方式
1. dos2unix 文件名
2. dos2unix -n 文件名1 文件名2	// 将 文件名1 转义并生成 文件名2

问题汇总

• ffmpeg 一定是 4.4 版本
• 在浏览器中运行wasm文件的时候报错Uncaught RangeError: WebAssembly.Compile is disallowed on the main thread, if the buffer size is larger than 4KB, 将编译的逻辑移入到webworker里面就解决了
• 被处理的文件名, 一定要搞成英文的