I am loading an invalid source into videojs player instance like this:

player.src({
    src: '',
    type: 'audio/mp4',
});

Then I try to catch the occurring error as follows:

player.on('error', () => {
    console.log(player.error); //Gives MEDIA_ERR_SRC_NOT_SUPPORTED error
})

which gives me the error thrown internally by videojs, but not the error that caused it. In my application, I am consuming an API that throws specific error code if you are trying to load a source that you are not supposed to. How could I catch such an error.

I would like to catch the first error in the screenshot below:

I am loading an invalid source into videojs player instance like this:

player.src({
    src: 'http://example./invalid',
    type: 'audio/mp4',
});

Then I try to catch the occurring error as follows:

player.on('error', () => {
    console.log(player.error); //Gives MEDIA_ERR_SRC_NOT_SUPPORTED error
})

which gives me the error thrown internally by videojs, but not the error that caused it. In my application, I am consuming an API that throws specific error code if you are trying to load a source that you are not supposed to. How could I catch such an error.

I would like to catch the first error in the screenshot below:

• javascript
• video.js

• Well you are trying to use functionality that is not available through videojs, as far as I checked the documentation right now. What you could do is to check if the src returns a success response (like 2xx) and only then continue to initialise the player. You can use this as a starting point: stackoverflow./questions/5344145/… – brance Commented May 18, 2020 at 21:10

2 Answers 2

I would like to catch the first error in the screenshot below:

You can't. It is invoked when src attribute element in video element changes.

However you can listen to it.

const playerElement = document.querySelector("#player")

playerElement.addEventListener("error", (event) => {
  console.log(event.target.error.message);
})

const player = videojs('player');

player.src({
    src: 'http://example./invalid',
    type: 'audio/mp4',
});

<script src="https://vjs.zencdn/7.7.6/video.js"></script>
<video id="player" ></video>

It is not documented and it is definitly implemented the wrong way, but I found a way to catch this errors!

Instead of using the 'mediaerror' that is never triggered but should be in this case you also cannot use the regular 'error' event, but the error event is thrown, but as 'aderror' (don't mix up with 'adserror').

So try this:

player.on('aderror', () => {
    console.log(player.error()); //Gives MEDIA_ERR_SRC_NOT_SUPPORTED error
})