Catching invalid source error using videojs

Question

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

player.src({
    src: 'http://example.com/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:

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: https://stackoverflow.com/questions/5344145/how-to-get-response-status-code-from-jquery-ajax — brance, May 18 '20 at 21:10

score 3 · Answer 1 · answered May 18 '20 at 21:16

3

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.com/invalid',
    type: 'audio/mp4',
});

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

answered May 18 '20 at 21:16

Józef Podlecki

10,453
5
24
50

1

Trying this out now and I realized that this is actually not what I was looking for. This gives me the internal error that is thrown by videojs, as evidenced by the snippet, and not the actual network error, that in the case of the example should be some 404, I imagine – Andra Zeberga Aug 11 '20 at 19:07

score 0 · Answer 2 · answered Aug 23 '23 at 12:25

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
})

Catching invalid source error using videojs

2 Answers2