前端 - 使用videojs-flvjs-es6插件报错Cannot read properties of null (reading 'currentURL')问题?

Question

求助各位大佬:

使用videojs-flvjs-es6插件播放实时监控视频报错:
Uncaught TypeError: Cannot read properties of null (reading 'currentURL')

at t._reportStatisticsInfo (<anonymous>:1:260511)

下面是代码:

 let videoElement = document.querySelector('#' + this.randomId + ' .videoElement');                // const player = document.querySelector(`#${this.videoId[index]}`)                this.tempPlayer = videojs(                    videoElement,                    {                        techOrder: ['html5', 'flvjs'],                        flvjs: {                            mediaDataSource: {                                type: 'flv',                                isLive: true,                                hasAudio: false                            },                            config: {                                autoCleanupSourceBuffer: true,                                stashInitialSize: 1024,                                lazyLoad: false,                                autoCleanupMaxBackwardDuration: 60,                                autoCleanupMinBackwardDuration: 30,                                enableDurationMonitor: true, // true表示监测当前直播流延时，当发现延时过大时，主动追赶                                decreaseDurationStep: 1                            }                        },                        sources: [                            {                                type: 'video/x-flv',                                src:                                    'ws://' +                                    window.location.host +                                    '/' +                                    'video/rtspServer/' +                                    `?ip=196.168.11.10&port=8000&user=admin&password=pass@123&play=1&channel=33&bitstream=0`                            }                        ],                        liveui: true,                        autoplay: false, // 自动播放                        controls: 'controls', // 控制条                        bigPlayButton: false,                        textTrackDisplay: false                    }                );

请各位大佬帮忙看一下,这个要怎么解决?

控制台:

后端那边用c++实现的

Answer 1

数据源地址怎么是websocket,是不是弄错了,应该是rmtp协议的

Answer 2

根据你提供的错误信息，问题出在videojs-flvjs-es6插件尝试读取一个null对象的currentURL属性。这可能是由于多种原因造成的，以下是一些可能的解决方案：

1. 检查视频源URL：确保你的视频源URL是正确的，并且服务器上确实有一个视频流可供播放。错误可能是由于URL无效或服务器上没有视频流。
2. 检查插件配置：确保videojs和flvjs插件的配置正确。例如，你可能需要确保flvjs的mediaDataSource配置正确，并且与你的视频源兼容。
3. 检查DOM元素：错误信息指出在尝试读取currentURL属性时对象为null。这可能是因为你在尝试获取DOM元素时出现了问题。请确保videoElement确实存在，并且已经被正确地添加到了DOM中。
4. 检查插件版本：确保你使用的videojs-flvjs-es6插件版本与你的videojs版本兼容。有时候，插件的新版本可能会与旧版本的videojs不兼容。
5. 查看控制台日志：打开浏览器的开发者工具，查看控制台中的其他错误和警告信息。这些信息可能会提供更多关于问题的线索。
6. 联系插件开发者：如果以上方法都不能解决问题，你可以尝试联系videojs-flvjs-es6插件的开发者，向他们报告这个问题，并寻求帮助。

希望这些建议能帮助你解决问题。如果你需要更多的帮助，请随时向我询问。