Detect <embed> tag failing to load video

Question

I am trying to catch an error with the following embed tag (on iPad/iOS):

<embed width="320" height="240" 
  src="path/to/my/live/stream/playlist.m3u8"
  type="application/vnd.apple.mpegurl" postdomevents="true" id="movie1" />

I tried to catch it with the following:

$("#movie1").on('onerror', function() { alert('error!') } );

I also tried with onabort, onstalled, onended, and onsuspend - all not generating an event when the video fails to load.

Answer 1

You'll need to make a separate HTTP request to check the validity of the file path.

var http = new XMLHttpRequest();
http.open('HEAD', 'http://path/to/your/video', false);
http.send();

if (http.status == 404) {
    throw new Error('Unable to load file')
} else {
    // Generate your <embed> tag here
}