Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Basic instructions for the reloadSourceOnError plugin.

Using the reloadSourceOnError Plugin

Call the plugin activate it:

player.reloadSourceOnError()

Now if the player encounters a fatal error during playback, it will automatically attempt to reload the current source. If the error was caused by a transient browser or networking problem, this can allow playback to continue with a minimum of disruption to your viewers.

The plugin will only restart your player once in a 30 second time span so that your player doesn't get into a reload loop if it encounters non-transient errors. You can tweak the amount of time required between restarts by adjusting the errorInterval option.

If your video URLs are time-sensitive, the original source could be invalid by the time an error occurs. If that's the case, you can provide a getSource callback to regenerate a valid source object. In your callback, the this keyword is a reference to the player that errored. The first argument to getSources is a function. Invoke that function and pass in your new source object when you're ready.

player.reloadSourceOnError({

  // getSource allows you to override the source object used when an error occurs
  getSource: function(reload) {
    console.log('Reloading because of an error');

    // call reload() with a fresh source object
    // you can do this step asynchronously if you want (but the error dialog will
    // show up while you're waiting)
    reload({
      src: 'https://example.com/index.m3u8?token=abc123ef789',
      type: 'application/x-mpegURL'
    }); 
  }, 
  
  // errorInterval specifies the minimum amount of seconds that must pass before 
  // another reload will be attempted
  errorInterval: 5 
});
@imbcmdth
Copy link

imbcmdth commented Nov 10, 2016

Might want to make a note that doing an async request for the source will result in the error dialog being displayed until a new source is set. ...or suggest ways around that behavior.

@imbcmdth
Copy link

imbcmdth commented Nov 10, 2016

Otherwise, LGTM!

@DavexPro
Copy link

DavexPro commented Feb 7, 2017

It's FUXKING AWESOME ! It helps me a lot! THANK YOU VERY MUCH!

@ajw725
Copy link

ajw725 commented Jun 25, 2018

this plugin unfortunately doesn't work in Safari 11.1 (with VideoJS 7.0.3), and i can't figure out how to replicate the functionality. in Safari, for whatever reason, the "error" event just doesn't seem to fire. the request to the video URL returns a 403, but there's no uncaught exception or any kind of event i can find to bind to in order to reload the source.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment