自从2024年12月12日从广州南沙广汽的项目准备上线完毕，即刻奔赴京城进行下一个项目，原计划元旦前结束，但是2025年1月6号也就是今天，我还在酒店待着，眼瞅着放了一个星期的带薪假，好好整理一下这中间接近一个月的项目收货，重点就聚焦于flv.js实现海康威视监控实时播放，逆天的是支持九宫格视频浏览器实时播放。
常见的视频编码格式有哪些
- H.264（AVC）：一种广泛使用的视频编码标准，提供了较高的压缩率，同时保持了较好的视频质量。
- H.265（HEVC）：下一代视频编码标准，提供了比H.264更高的压缩率，但计算复杂度也更高。
- VP8：由Google开发的一种视频编码格式，用于WebM视频格式。
- VP9：VP8的继任者，提供了更高的压缩率和质量。
- AV1：一种开放、免专利费的视频编码格式，旨在替代H.264和HEVC。
flv.js为何物
项目中如何使用
海康RTSP转flv并实现h5页面播放_海康flv地址-CSDN博客
使用ffmpeg生成flv视频流在网页上显示海康摄像头图视频 - 柳暗花明8963 - 博客园
海康威视摄像头视频在web端播放FFmpeg + nginx-http-flv-module + flv.js（无需安装插件） - 掘金
自己系统集成海康威视摄像机和录像机实现监控与回放（二开海康威视摄像机）_摄像头系统集成-CSDN博客
常见报错
2.1 SourceBuffer报错
使用报错如下：Failed to read the ‘buffered’ property from ‘SourceBuffer’: This SourceBuffer has been removed from the parent media source.
- 解决方案1：
这种错误提示一般是在flv源发生异常中断的时候产生的。错误提示大多数都在 mse-controller.js 这个模块中。
解决办法：在 mse-controller.js中（flv.js/src/core/mse-controller.js），appendMediaSegment()、_needCleanupSourceBuffer()这些方法的入口处调用检查以下MediaSource的合法性
if (!this._mediaSource || this._mediaSource.readyState !== 'open') {
return;
}
- 解决方案2
- 解决方案3：
在使用flv播放视频流的时候遇到了个错误Uncaught (in promise) DOMException: Failed to read the ‘buffered’ property from ‘SourceBuffer’:This SourceBuffer has been removed from the parent media source.
`
`
解决的关键是当弹框关闭的时候，直接调用flv的方法的话不能直接销毁的话，没有完全销毁这个video，然后刚刚开始我给他加了一个key的值，然后创建一个flv对象的时候就自增，看看还会不会报错，结果没有报错，是可以正常获取到视频的，但是视频没有显示出来，然后我加多一个v-if，关闭弹框就把整个video销毁了，然后就没有报错了。
因此总结了一下：之所以会报这个错误的话是因为没有完全销毁这个组件，最简单的做法就是把整个video销毁掉。
flv优化方案
flv几个不同参数
enableWorker：是否启用Web Worker来解码视频。enableStashBuffer：是否启用缓冲区，以减少卡顿。stashInitialSize：缓冲区的初始大小。
