调用flv.js显示监控视频遇到的问题

flv.js开源地址：https://www.bootcdn.cn/flv.js/

代码

<video class="video" id="videoElement"></video>

/* 隐藏播放、暂停等各类播放器功能按钮 */
video::-webkit-media-controls-fullscreen-button {
    display: none;
}
video::-webkit-media-controls-play-button {
    display: none;
}
video::-webkit-media-controls-timeline {
    display: none;
}
video::-webkit-media-controls-current-time-display{
    display: none;            
}
video::-webkit-media-controls-time-remaining-display {
    display: none;            
}
video::-webkit-media-controls-mute-button {
    display: none;            
}
video::-webkit-media-controls-toggle-closed-captions-button {
    display: none;            
}
video::-webkit-media-controls-volume-slider {
    display: none;            
}
video::-webkit-media-controls-enclosure{ 
    display: none;
}

/* 视频全铺 */
.video{
    object-fit: fill;
}

if (flvjs.isSupported()) {
    var videoElement = document.getElementById('videoElement');
    var flvPlayer = flvjs.createPlayer({
        type: 'flv',
        url: url // 你的视频地址
    });
    flvPlayer.attachMediaElement(videoElement);
    flvPlayer.load();
    flvPlayer.play();
}

报错

监控视频可以正常显示，但控制台会不断的报错：

flv.min.js:6 [TransmuxingController] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported audio codec idx: 7

flv.min.js:1 Uncaught (in promise) Error: Uncaught, unspecified "error" event. (MediaError)

原因

谷歌浏览器禁止了video、audio标签的autoplay属性

谷歌的初衷不是禁止视频，而是禁止音频，但是视频中包含了音频信息，所以一并被禁止了

解决方法

给video标签添加muted属性：

<video class="video" id="videoElement" muted></video>

参考来源：https://blog.csdn.net/weixin_37340613/article/details/89215923